Witam wszystkich. Chciałabym prosić o pomoc w rozwiązaniu pewnego problemu, z którym nie mogę się sama uporać. Problem polega na tym, że fragment strony, którą robię, wygląda inaczej w Operze, a inaczej w pozostałych przeglądarkach, które sprawdzałam (IE, Firefox, Chrome). Zamieszczam szkielet strony, na którym jest to widoczne (nie jest to oczywiście właściwa grafika, tylko szablon z zaznaczonymi miejscami, w których będą elementy graficzne, ale nie ma to znaczenia, bo kod będzie ten sam): http://natbed.cba.pl/strona/index.html (przepraszam za wkurzające reklamy, ale chwilowo nie miałam lepszego miejsca niż ten darmowy serwer, nie mają one wpływu na ten problem, bo na dysku jest tak samo). Chodzi o główny tekst na białym tle oraz ten krótszy tekst na ciemnoszarym. W operze oba teksty znajdują się około 50 pikseli pod dużym jasnoszarym polem, a w pozostałych przeglądarkach około 75 pikseli, co wizualnie robi sporą różnicę. Nie mam pomysłu, skąd to się bierze i jak to rozwiązać sad.gif Może ktoś z Was potrafiłby mi pomóc i dać jakąś wskazówkę?
Z góry dziękuję i pozdrawiam.

PS. Tu kod strony i CSS:

Kod
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Lorem Ipsum</title>
<meta name="description" content="..........................................................">
<meta name="keywords" content=".............................................">
<meta http-equiv="content-language" content="pl">
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<link href="style.css" rel="stylesheet" type="text/css">
    
    <script src="scripts/cufon-yui.js" type="text/javascript"></script>
    <script src="scripts/Impact_400.font.js" type="text/javascript"></script>
    <script type="text/javascript">
        Cufon.replace('h1, h2', { fontFamily: 'Impact' });
    </script>
    
</head>

<body>

<div id="header">
    
    <h1>Lorem ipsum dolor</h1>
    <h2>SIT AMET CONSECTETUR ADIPISCING</h2>
    
    <a class="logo" href=""></a>
    <br class="clear">
    
    <ul class="navbar">
        <li class="nav1"><a href="">ELIT CRAS<br>FRINGILLA</a></li>
        <li class="nav2"><a href="">SOLLICITUDIN</a></li>
        <li class="nav3"><a href="">LACUS</a></li>
        <li class="nav4"><a href="">VITAE</a></li>
    </ul>
    <br class="clear">
        
    <div id="sidebar">
        <h3>Lorem ipsum dolor</h3>
        <p>Sit amet consectetur adipiscing elit. Cras fringilla sollicitudin lacus vitae posuere. Integer faucibus rhoncus lobortis.</p>
        <p class="telephone">tel. kom. 000 000 000</p>
        <p class="e-mail"><a href="mailto:loremipsum@dolorsitamet.pl" class="e-mail">loremipsum@dolorsitamet.pl</a></p>
    </div>
    
    <div id="main">
        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque rutrum magna eu tortor malesuada viverra. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque vel semper quam. Nullam eu ipsum neque, id molestie neque. Quisque feugiat tortor in metus egestas euismod. Sed ac magna leo, ut volutpat ligula. Proin at nulla vitae nisi accumsan facilisis.</p>
        <p class="last">Vivamus nisl quam, tristique rhoncus fermentum sit amet, elementum convallis dolor. Nulla dignissim consequat lobortis. Aliquam ultricies ultricies metus, at rhoncus diam scelerisque non. Suspendisse augue tortor, placerat sit amet consequat non, porttitor vel ligula. Fusce ullamcorper tincidunt purus suscipit laoreet. Fusce sagittis, ante vitae vulputate congue, est turpis fringilla purus, eget facilisis odio nunc ac nisl. Sed at nisi metus, vel iaculis justo. Suspendisse potenti. Aenean eu accumsan velit. In sem mauris, eleifend vitae aliquet vel, dignissim non justo. Integer risus purus, pellentesque sed tincidunt sit amet, congue eget justo. Curabitur rhoncus congue elit. Nullam luctus nisi non urna luctus rutrum. Suspendisse potenti. Quisque porta lobortis ullamcorper.</p>
    </div>
        
</div>

</body>
</html>


Kod
/*-------    ZERUJE DOMYSLNE USTAWIENIA PRZEGLADAREK ----------------------------------- */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,
blockquote,th,td { margin:0 auto; padding:0; line-height:17pt; font-size:13px; color:#000000; font-family:tahoma; }
img { margin:0; padding:0; border:0; text-decoration:none; }
ol,ul { list-style:none; }
a, a:link, a:hover, a:active { font-weight:bold; color:#000000; text-decoration:none; margin:0; padding:0; }
a:hover { text-decoration:underline; }
h1 { margin:20px 0 0 23px; font-size:28px; font-weight:normal; color:#ffffff; float:left; }
h2 { position:absolute; margin:52px 0 0 23px; font-size:16px; font-weight:normal; color:#ffffff; }
h3 { color:#ffffff; }
.clear { clear:both; height:0; font-size: 1px; line-height: 0px; }
a.e-mail { color:#ffffff }

body { margin:0 auto; padding:0; background:url(background.jpg) repeat-y; background-position: center; }

#header { margin:0 auto; padding:0; width:989px; height:531px; background:url(header.png) no-repeat; }

a.logo { margin:20px 0 0 0; padding:0; height:60px; width: 168px; background:url(logo.jpg) no-repeat; display:block; overflow:hidden; float:right; }
a.logo:hover { background-position: 0px -60px; }

ul.navbar { margin:26px 0 0 58px; position:absolute; text-align:center; }
ul.navbar, ul.navbar li { display:block; }
ul.navbar li.nav1 { float:left; padding:35px 0 0 0; width:118px; height:118px; background:url(nav-green.png) no-repeat; }
ul.navbar li.nav2 { float:left; margin:0 0 0 27px; padding:47px 0 0 0; width:118px; height:118px; background:url(nav-blue.png) no-repeat; }
ul.navbar li.nav3 { float:left; margin:0 0 0 27px; padding:47px 0 0 0; width:118px; height:118px; background:url(nav-green.png) no-repeat; }
ul.navbar li.nav4 { float:left; margin:0 0 0 373px; padding:47px 0 0 0; width:118px; height:118px; background:url(nav-blue.png) no-repeat; }
ul.navbar a { font-weight:bold; color:#ffffff; font-size:12px; }

#sidebar { float:left; margin:490px 0 0 24px; }
#sidebar p { width:160px; color:#ffffff; margin:0; }
#sidebar p.telephone { color:#ffffff; background:url(dot.png) no-repeat; margin:25px 0 0 0; padding:0 0 0 20px; }
#sidebar p.e-mail { color:#ffffff; background:url(dot.png) no-repeat; margin:10px 0 0 0; padding:0 0 0 20px; }

#main  { float:right; margin:490px 0 0 0; text-align:justify;}
#main  p { width:663px; padding:0 0 15px 0; }
#main  p.last { width:663px; padding:0 0 80px 0; background:url(line.jpg) no-repeat; background-position:bottom; }


EDIT: Już nieaktualne, problemem było <br class="clear"> smile.gif