tutorials.de Buch-Aktion 05/2012
ERLEDIGT
JA
ANTWORTEN
2
ZUGRIFFE
1618
EMPFEHLEN
  • An Twitter übertragen
  • An Facebook übertragen
AUF DIESES THEMA
ANTWORTEN
  1. #1
    Mäthe Mäthe ist offline Rookie
    Registriert seit
    Sep 2009
    Beiträge
    6
    Hallo!

    Ich habe mir eine kleine Navigationsleiste gebaut, mit nem Hover Effekt, dass er das Menü nach unten ausklappt. Das klappt soweit auch, außer im IE. Habe bei mir den IE8 installiert und das Menü wird nicht nach unten aufgeklappt, sonder einfach neben dem Link. Hoffe es weiß jemand warum. Hier mein Code:

    Code :
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
    "http://www.w3.org/TR/html4/strict.dtd">
    <html>
            <head>
                    <title>Navigation</title>
                    <style type="text/css">
                     #menu {margin:10px; padding: 0 0 20px 10px; border-bottom: 1px solid #900; position: relative;}
                     #menu ul, #menu li {margin: 0; padding: 0; display: inline; list-style-type: none;}
                     #menu a:link, #menu a:visited {line-height: 14px; font-family: 'Arial', sans-serif; margin: 0 10px 4px 10px; color: #999;}
                     #menu a:link#current, #menu a:visited#current, #menu a:hover {padding-bottom: 2px; background: transparent; color: #000;}
                     #menu a:hover { color: #900;}
                     #menu a { color: #000; text-decoration: none; }
                     #menu ul ul { position: absolute;}
                     #menu ul ul ul { position: absolute; top: 0; left: 100%; }
                     div#menu ul ul, div#menu ul li:hover ul ul, div#menu ul ul li:hover ul ul{display: none;}
                     div#menu ul li:hover ul, div#menu ul ul li:hover ul, div#menu ul ul ul li:hover ul {display: block;}
     
                     </style>
                     <!--[if lt IE 7]>
                     <script src="http://ie7-js.googlecode.com/svn/version/2.0(beta3)/IE7.js" type="text/javascript"></script>
                     <![endif]-->
     
     
            <base target="hauptseite">
            </head>
            <body>
                    <div id="menu">
                            <ul>
                                    <li><a href="mainpage.html">Home</a></li>
                                    <li><a href="angebote.html">Angebote ></a>
                                             <ul>
                                                     <li><a href="tonsets.html">Tonsets</a></li>
                                                     <li><a href="lichtsets.html">Lichtsets</a></li>
                                             </ul>
                                    </li>
                                    <li><a href="geraete.html">Geräte ></a>
                                             <ul>
                                                     <li><a href="boxen.html">Boxen</a></li>
                                                     <li><a href="verstaerker.html">Verstärker</a></li>
                                                     <li><a href="mischpulte.html">Mischpulte</a></li>
                                                     <li><a href="licht.html">Lichtequipment</a></li>
                                                     <li><a href="mikrofone.html">Mikrofone</a></li>
                                                     <li><a href="zubehoer.html">Zubehör</a></li>
                                             </ul>
                                    </li>
                                    <li><a href="referenzen.html">Referenzen</a></li>
                                    <li><a href="kontakt.php">Kontakt</a></li>
                                    <li><a href="impressum.html">Impressum</a></li>
                            </ul>
                    </div>
            </body>
    </html>
     

  2. #2
    Maik Tutorials.de Gastzugang
    Hi,

    die IE-Familie (6 - 8) erwartet neben deiner position:absolute-Regel für die erste Submenüebene, auch eine Angabe zu ihrer Startposition.

    Code css:
    1
    
    #menu ul ul { position: absolute; top: 16px; left: 10px; }

    mfg Maik
     

  3. #3
    Mäthe Mäthe ist offline Rookie
    Registriert seit
    Sep 2009
    Beiträge
    6
    ach so einfach, da steht man davor....

    Danke jetzt klappts
     

Ähnliche Themen

  1. a hover CSS Menü
    Von lol1983 im Forum CSS
    Antworten: 3
    Letzter Beitrag: 06.09.10, 14:45
  2. horizontales Menü hover
    Von tombo82 im Forum CSS
    Antworten: 1
    Letzter Beitrag: 12.11.09, 12:23
  3. Hover Menü und Bild Hover
    Von GFENONO im Forum CSS
    Antworten: 9
    Letzter Beitrag: 05.12.07, 17:18
  4. Antworten: 18
    Letzter Beitrag: 17.05.07, 16:51
  5. Hover Menü
    Von fireball-le im Forum Javascript & Ajax
    Antworten: 1
    Letzter Beitrag: 03.09.03, 19:40