Autor Zpráva
Apophys
Profil *
Ahoj,
mám problém s rozchozením horizontálního menu v IE
1) Potřeboval bych různě dlouhá tlačítka první úrovně menu. V Mozille stačí dát width:auto; a vše funguje jak má. U IE je pak ale každé tlačítko na celý řádek.
2) U IE mi klasicky nefunguje rozbalování. Do stylopisu jsem vložil nějaký stažený .htc soubor, ale nevím jestli je vložen na špatné místo v html, nebo je chyba přímo v něm, nebo kolize se zbytkem kódu..?


Stránka: apo-vystoupeni.cz

STYL
#vodorovne-menu {
text-align:center;
position:absolute;
top:-56px;
left:20px;
text-align:left;
color:#FFFFFF;
font-size:24px;
margin: 0;padding: 0;
}

ul#vodorovne-menu li
{
behavior: url(hovermenu.htc);
} 

#vodorovne-menu li {; float:left; list-style-type:none;}
#vodorovne-menu li a {display:block; height:29px; width:auto; #width:100px;line-height:24px;  text-decoration:none;color:#fff; padding:0 10 0 0;}
#vodorovne-menu li a:hover { background:  url(/grafika/new/howerbutton.jpg) repeat-x center top; padding:0 10 0 0; color:#ffcc00;}
#vodorovne-menu li ul {display:none;}
#vodorovne-menu li:hover ul { display:block; position:absolute; border: solid #333333; border-width:0 1px 1px 1px; margin: 0;}
#vodorovne-menu li:hover ul li { text-align:left; display:block; float:none; height:29px; width:auto; min-width:110px; border-top: 1px solid #cccccc; margin: 0; }
#vodorovne-menu li:hover ul li a {background:#333333;}
#vodorovne-menu li:hover ul li a:hover {background: url(/grafika/new/howerbutton.jpg) repeat-x ;color:#ffcc00;}


HTML
<div id="vodorovne-menu">
				
  <ul>
    <li><a href="#home" title="Apo - úvodní stránka" >Apo</a></li>
    <li><a href="#home" title="Apova nabídka" >Nabídka</a>

      <ul>
        <li><a href="#">Vystoupení</a></li>
        <li><a href="#">Doprovodný program</a></li>
        <li><a href="#">Poweriser půjčovna</a></li>
		<li><a href="#">Promoakce</a></li>
		<li><a href="#">Žonglování</a></li>
      </ul>
    </li>
	
    <li><a href="#home" title="foto a video" >Galerie</a>

      <ul>
        <li><a href="#">Foto</a></li>
        <li><a href="#">Video</a></li>
        </ul>
    </li>
    <li><a href="#home" title="Další informace o skákacích botách a jednokolkách" >Další info</a>
	   <ul>
        <li><a href="#">Skákací boty</a></li>
        <li><a href="#">Jednokolky</a></li>
        <li><a href="#">O mně</a></li>
		<li><a href="#">Apo doporučuje</a></li>
      </ul></li>
	<li><a href="#home" rel="nofollow" title="Apo-kontakt" >Kontakt</a></li>		
 </ul>

</div>


Budu vděčný za vaše rady.
Děkuju
habendorf
Profil
Pro link vyhoď display:block; width:auto a #width:100px;, místo toho dej float:left;

Co se týče IE, behavior nastav jen pro IE lte 6. A chybí ti tam deklarace pro li.hover, takže to fungovat samozřejmě nemůže.
Chamurappi
Profil
Reaguji na habendorfa:
behavior nastav jen pro IE lte 6
To by mu přestal fungovat :hover v novějších Explorerech, protože jede v quirku.
Apophys
Profil *
Děkuju za rady Zkusím se tím nějak prokousat ;-)

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: