viete mi niekto s týmto poradiť? Na image som vyznačila kde sa nachádza chyba, ten rámik sa tam nezobrazí cez dve položky ale len cez jednu a tá druhá je len vyznačená. A pri nábehu keď sa rozbalí to "forum" tak mi to vytlačí poslednú položku menu "FAQ" ale vyzerá to, že to robí len skrz veľkosť lebo ak bola menšia (90px) tak sa to "FAQ" nepresunulo na druhý riadok.
.css
Kód:
#menu ul {
width:1090px;
height:40px;
position:absolute;
top:160px;
left:0px;
border:1px solid black;
opacity:0.6;
background-color:#360;
list-style-type: none;
margin: auto;
}
#menu li{
float:left;
width:auto;
}
#menu ul a {
margin-top:8px;
margin-left:19px;
margin-right:19px;
display: block;
line-height: 20px;
text-decoration: none;
font-family: Georgia, "Times New Roman", Times, serif;
font-size: 21px;
color: black;
}
#menu ul a:hover {
color: #FFF;
}
#menu li ul {
display: none;
width:90px;
/* Width to help Opera out */
background-color: #360;
}
#menu li:hover ul {
display: block;
position: relative;
top:0px;
left:0px;
width:auto;
margin: 0;
padding: 0;
}
#menu li:hover li {
float: none;
}
#menu li:hover li a {
background-color: #360;
border-bottom: 1px solid #fff;
color: #000;
}
#menu li li a:hover {
background-color:#2AFF00;
}
.html
Kód:
<div id="menu">
<ul>
<li id="Home"><a href="#">Home</a></li>
<li id="Kalendar"><a href="#">Kalendár akcií</a></li>
<li id="Archiv"><a href="#">Archív hier</a></li>
<li id="Uzivatelia"><a href="#">Hráči</a></li>
<li id="Teamy"><a href="#">Teamy</a></li>
<li id="Shopy"><a href="#">PB/Army shopy</a></li>
<li id="Ihriska"><a href="#">Ihriská</a></li>
<li id="Forum"><a href="#">Forum</a>
<ul>
<li><a href="#">SK FORUM</a></li>
<li><a href="#">CZ FORUM</a></li></ul></li>
<li id="FAQ"><a href="#">FAQ</a></li>
</ul>
</div>
printscreen:
http://uploading.sk/?v=beznzvzoz.png
Problem je v tom, ze si musis nadefinovat triedu pre submenu. Malo by to ist takto:
Choď na stránku: 