Forum Webmastera, HTML, CSS, PHP, MySQL, Hosting, Domeny - Forum dla Webmasterów
Niepoprawne zachowanie Chrome - Wersja do druku

+- Forum Webmastera, HTML, CSS, PHP, MySQL, Hosting, Domeny - Forum dla Webmasterów (https://www.webmastertalk.pl)
+-- Dział: Technologie internetowe - tworzenie stron WWW (https://www.webmastertalk.pl/forum-technologie-internetowe-tworzenie-stron-www)
+--- Dział: xHTML, CSS, JavaScript (https://www.webmastertalk.pl/forum-xhtml-css-javascript)
+--- Wątek: Niepoprawne zachowanie Chrome (/thread-niepoprawne-zachowanie-chrome)



Niepoprawne zachowanie Chrome - lomek - 11-09-2013

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>



RE: Niepoprawne zachowanie Chrome - Kartofelek - 12-09-2013

1) http://stackoverflow.com/questions/14942781/in-css-why-does-the-combination-of-float-left-displaytable-margin-x-on-m
Moim zdaniem display:table i float:left się wykluczają więc chrome ma troche racji (table nie powinno mieć float) W powyższym linku rozwiazanie finalne to potwierdza.
2) http://doman.art.pl/webmaster/popupy/ (centrowanie popupa metoda 3) - dziala bardzo dobrze wszedzie
3) możesz też użyć line-height:55px?