[div`y a opera] - dostosowanie stron do różnych przeglądarek

[greenripper]

Witam,
Problem jest bardzo prosty a jednak nie mogę znaleźć żadnego sensownego rozwiązania. Mam stronkę skonstruowaną mniej więcej tak:

<div id="site">
<div id="top"></div>
<div id="left">
<div id="lefta"></div>
<div id="leftb"></div>
<div id="leftc"></div>
</div>
<div id="right"></div>
</div>
Strona ma pocięte tło więc wypadałoby żeby każdy z bloczków ściśle do siebie przylegał. I tu jest problem: w stylach przy każdym bloku klepię na wszelki wypadek: margin: 0px; padding: 0px; border:none. W bloku leftb znajduje się menu utworzone za pomocą listy ul. Wszystkie parametry heigh i width sprawdzone po dziesięć razy i w IE nie ma problemu strona wyświetlana jest wzorowo natomiast w operze blok leftb "spada" o 12px w dół. Co za tym idzie przesuwa się też następny - ten pod nim i cała stronka się rozjeżdża. Sprawdziłem dokładnie treść pliku *css i nawet w żadnym miejscu nie zastosowałem wartości 12px nawet do formatowania tekstu.
Skąd to się mogło wziąć i jak toto sprostować żeby strona była poprawnie wyświetlana i w operze?

[koziolek]

umieść na samej górze arkusza css. Wyzerowuje wszystkie popularne przeglądarki. Bazowa czcionka dla body 1em = 10px;

Kod: Zaznacz cały

body{font-size:10px}
html,body,form,ul,ol,dl,h1,h2,h3,h4,h5,h6,p,pre,blockquote{margin:0;padding:0}
th,td{font-size:1em}
h1,h2,h3,h4,h5,h6{font-weight:normal;font-size:1em}
p{margin-bottom:1ex}
ul{list-style-type:none}
.lar ul,.bar ul,ul.comment,ul.forum{margin-left:25px;list-style-type:disc}
.lar ol,.bar ol,ol.comment,ol.forum{margin-left:25px;}
address{font-style:normal} 
.clearfix:after{content:".";display:block;height:0;line-height:0;clear:both;visibility:hidden}
.clearfix{display:inline-table}
/* Hides from IE-mac \*/
* html .clearfix{height:1%}
.clearfix{display:block}
.clear_fix {line-height:1px; height:1px; display:none; clear:both}
/* End hide from IE-mac */
label{cursor:pointer;cursor:hand}

[greenripper]

Dzięki. Działa!!! Ktoś wie dlaczego tak się dzieje? Przeglądarki mają jakieś domyślne ustawienia dla niektórych znaczników html?

[koziolek]

Jest coś takiego jak domyślne css przeglądarki. Każda przeglądarka używa więc własnych styli domyślnych. W FF to jest gdzieś na wierzchu w IE zaszyte a w Operze nie sprawdzałem..

[greenripper]

Dzięki.
Mam jeszcze jeden problem przy którym powyższe "zerowanie" nic nie daje:
Zrobiłem sobie menu poziome z listą wyświetlaną inline. Poszczególne komórki to odnośniki wyświetlane jako blok o wysokości 48px. Żeby wyśrodkować tekst w pionie musiałem umieścić go między znacznikami <p></> i dodać padding. Wszystkie elementy menu w IE ściśle przylegają do siebie, a w operze robią się odstępy o szerokości 4px. Skąd to się bierze?

[koziolek]

ponieważ Opera i IE inaczej liczą paddingi (jest inna baza). Lepszą metodą jest :

Kod: Zaznacz cały

#menu li{
  display: block;
  float: left;
}

a w kodzie menu:

Kod: Zaznacz cały

<ul id="menu" class="clearfix">
...
</ul>

Możesz też użyć haków css w celu zdefiniowania osobnych wartości dla Opery i IE

[greenripper]

dzięki wielkie