Dlaczego strona się źle wyświetla?

Pierwsza podstawowa uwaga:

Jeżeli chcemy aby pod IE8 strona wyświetlała się według nowszych standardów to musimy podawać nagłówek w przeciwnym wypadku będzie tak jak pod IE6.

Np:

br />
   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

Tak na szybko zmieniłem trochę plik style.css i jest w miarę poprawnie.

body {background-image: url(tlo.gif); text-align: center;}

div {margin:0px; padding: 0px 0px 20px 0px; width: 905px; vertical-align: top; 

margin-left: auto; margin-right: auto; margin-left: auto; margin-right: auto;}

div.kontener { text-align:left;}

div.logo {width:899px;border-left: 3px solid black; border-top: 3px solid 

black; border-right: 3px solid black;background-color: #FFF2C0; height:140px; text-align: center;}

div.mar {padding: 0px; border: 3px solid black; background-color: #FFFFB1; height:18px;width:899px;}

div.menu {border-left: 3px solid black; background-color: #FFF2C0; width:170px; float: left; text-align:left; text-align: center;min-height: 650px;}

div.srodek {padding:10px;border-left: 1px solid black; border-right: 1px solid black; background-color: #FFFFB1; width:537px; float: left; min-height: 650px;}

div.right {border-right: 3px solid black; background-color: #FFF2C0; width:170px; float: left; text-align:left; min-height: 650px;}

div.right ul { margin: 0 10 0px 10; font-size: 10px; font-family: verdana; text-align:left; list-style-type: square;}

div.right li {margin: 0 0 10px 0;}

div.right ul a {color: black; text-decoration: none; }

div.right ul a:hover {color: black; text-decoration: underline}

div.stopka {clear:both;width:899px; margin: 0; border: 3px solid black; 

font-family: verdana; font-size: 7pt; text-align: center; background-color: 

#FFF2C0; vertical-align: top; margin-left: auto; margin-right: auto;}

p.menu {margin: 10px 10px 0 10px;

font-size: 9pt;

font-weight: bold;

text-align: center;

font-family: verdana,tahoma,helvetica,sans-serif;

background-color: #B1BBBE;

border-left: 1px solid black;

border-right: 1px solid black;

border-bottom: 1px solid black;

border-top: 1px solid black;}

p.naglowek {font-family: arial;

font-size: 15px;

font-weight: bold;

margin: 30px 20 0 20px;

padding: 0px 0px 0px 0px;

text-transform: uppercase; }

p.tresc {font-family: verdana;

font-size: 10pt;

text-indent: 20px;

text-align: justify;

margin: 10px 20 0 20px;

padding: 0px 0px 0px 0px; }

hr.linia {height: 2px; border: 0; background-color: black; margin: 7px 20 7 

20px;}

a.menu {background-color:#FFF2C0; display: block; }

a.menu:hover {background-color:#FFFFB1;}

Dzięki za zainteresowanie. Teraz już wygląda dobrze ale w tym bloku po prawej gdzie jest “Nowe” tekst jest wyrównany do prawej strony. Przecież w stylach jest text-align:left więc dlaczego wyświetla sie po prawej?