Autor Zpráva
jmills
Profil
Dobrý deň.
Potrebujem poradiť. Mám vertikálne rozbalovacie menu http://karolox.szm.com/ a je problém so zobrazením v IE (9), je rozhádzané... Firefox ho zobrazuje správne. Kód som "pozliepal" z rôznych návodov z internetu. Pôvodne som chcel takéto menu www.guygagnon.com/accueil_en.htm čo je naľavo. Pomôže mi niekto opraviť ten môj kód, alebo vedel by niekto spraviť takéto ako je v tom druhom linku? ps: najlepšie ak by to šlo bez java skriptu a pod. :) Vopred Vám ďakujem za pomoc!

Karol

HTML kod
<div id="nav-primary">
    <ul>
  
        <li><a href="#">Abstract</a>
            <ul>
                <li><a href="#">Abstract [1]</a>
                <li><a href="#">Abstract [2]</a></li>
                <li><a href="#">Abstract [3]</a></li>   
                </li>
            </ul>
        </li>
        
        <li><a href="#">Architecture</a>
            <ul>
                <li><a href="#">Architecture [1]</a>
                <li><a href="#">Architecture [2]</a></li>
                <li><a href="#">Architecture [3]</a></li>   
                </li>
            </ul>
        </li>
    
         <li><a href="#">Macro/Detail</a>
            <ul>
                <li><a href="#">Macro/Detail [1]</a>
                <li><a href="#">Macro/Detail [2]</a></li>
                <li><a href="#">Macro/Detail [3]</a></li>   
                </li>
            </ul>
        </li>
         
         <li><a href="#">Themes</a>
            <ul>
                <li><a href="#">Cemetery</a>
                <li><a href="#">Winter</a></li>
                <li><a href="#">...</a></li>   
                </li>
            </ul>
        </li>
    
         <li> &nbsp; </li>

         
         <li><a href="about.html">About me</a>
    
    </ul>
</div>            

CSS
#nav-primary{
    background: #444;
    height: 40px;
}
 
#nav-primary ul{
    background: #444;
    list-style: none;
    margin: 0;
    padding: 0;
}
 
#nav-primary li{
    float: left;
    position:relative;
}
 
#nav-primary a{
    color: #fff;
    display: block;
    float: left;
    height: 40px;
    line-height: 40px;
    padding: 0 10px;
    text-decoration: none;
}
 
#nav-primary a:hover{
    background: #555;
}

#nav-primary ul ul{
    display:none;
    position: absolute;
    top: 40px;
    left: 0;
    width: auto;
Kaminko
Profil
<ul>
                <li><a href="#">Abstract [1]</a>
                <li><a href="#">Abstract [2]</a></li>
                <li><a href="#">Abstract [3]</a></li>   
                </li>
            </ul>
Môže to byť preto, lebo máš v prvej položke menu prvé <li> no druhé máš až na konci, preto to IE berie ako jednu položku menu.


Máš to v každom. Oprav to a všetko bude v pohode.


A prečo máš v #nav-primary- ul ul position absolute ? Nebolo by praktickejšie dať position relative ?
jmills
Profil
Kaminko:
Ahoj. Ďakujem pomohlo to. Iba to position absolute som nemenil, lebo ak som dal position relative, tak ak som kurzorom prišiel na položku menu, rozhadzalo ho...

Karol.

Vaše odpověď

Mohlo by se hodit


Prosím používejte diakritiku a interpunkci.

Ochrana proti spamu. Napište prosím číslo dvě-sta čtyřicet-sedm: