11-09-2013, 17:00
Witam, sprawdźci proszę co w tym kodzie jest źle? Problem jest taki, że jak najedziemy na drugi element tej listy to w chrome następuje lekkie przesunięcie niektórych elementów listy (problem powoduje table-cell ale jest mi potrzebne do wertykalnego wyśrodkowania), pod firefoxem problem nie występuje
Kod:
<!DOCTYPE html>
<html>
<head>
<STYLE type="text/css">
ul{border:1px solid #ccc;float:left;padding-left:0;list-style:none;}
li{float:left;height:55px;position:relative;display:table;}
a{padding:0 5px;display:table-cell;vertical-align:middle;}
a:hover{background:#ccc;}
ul li ul{display:none;position:absolute;left:0px;top:55px;}
ul li:hover ul{display:block;border:none;padding:0;margin:0}
</STYLE>
</head>
<body>
<ul>
<li><a>Item</br>i item</a></li>
<li><a>Item</a>
<ul>
<li><a>Item</a></li>
<li><a>Item</a></li>
<li><a>Item</a></li>
</ul></li>
<li><a>Item</a></li>
<li><a>Item</a></li>
</ul>
</body>
</html>
