bawiłem się ostatnio xhtml'em i postanowiłem napisać stronkę bez użycia tabel, bo tak jest doradzane. I właściwie, o dziwo, wszystko działa... Tyle że pod Firefoxem, Operą, Mozillą... A pod IE nie. Nie dość, że nie działa pod IE pseudoklasa hover dla elementu li, to jeszcze mam problem z atrybutem float dla div.menu, przez co cała treść strony wyświetla się za nisko (na samym dole. (Dla ułatwienia miejsce gdzie ma sie wyświetlać treść ma kolor tła zielony )
Pomęczył bym się jeszcze troche i potestował z różnymi parametrami, ale jak sie wielokrotnie przekonałem i tak nie uzyskam rezultatu ktory by mi odpowiadal ;[ Nie wiem... Może ktoś będzie miał jakiś pomysł. Ja już na widok IE wymituje ;p
To adres stronki: http://www.lo3.wroc.pl/~pkoszul/g23/index1_ie.html
A to źródło:
Kod: Zaznacz cały
<?xml version="1.0" encoding="iso-8859-2"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Oficjalna strona Gimnazjum nr 23 we Wrocławiu</title>
<meta name="GENERATOR" content="Quanta Plus" />
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-2" />
<style type="text/css">
/* <![CDATA[ */
* {margin:0px; border-style:none; font-family:sans-serif; font-size:8pt; padding:0px}
body {background-image:url('img_p/tlo1.jpg'); text-align:center; color:#ffffff;}
div.container {width:780px; border-style:dashed; border-width:1px; border-color:#281E6A; margin-left:auto; margin-right:auto; text-align:center;}
div.banner {height:80px; width:760px; background-color:#9B9B9B; margin-left:auto; margin-right:auto; margin-top:5px; margin-bottom:5px}
div.main {height:auto; width:760px; margin-left:auto; margin-right:auto; background-color:#FAFAFA; background-image:url('img_p/tlo2.jpg'); background-repeat:repeat; vertical-align:top}
div.footer {height:30px; width:760px; margin-left:auto; margin-right:auto; margin-bottom:10px; margin-top:5px; background-color:#004B96; border:dashed #8CB9E6 1px}
div.menu {float:left; width:120px; background-color:#D1E7FF; height:auto}
div.text {width:639px; position:relative; left:120px; height:auto; min-height:550px; border-left:dashed #D4CFAC 1px; background-color:green}
div.main_pasek {width:100%; height:20px; border-bottom: dashed #FFFFFF 1px}
div#menu_pasek {background-color:#FF0004}
div#text_pasek {background-color:#D1E7FF}
div#menu_pasek_bottom {position:relative; bottom:0px; background-color:#FF0004}
div.menu_category {padding-bottom:2px; padding-top:2px; width:120px; height:15px; font-weight:bold; background-color:#0062d0; margin-top:3px; margin-bottom:2px; text-align:left; background-image:url('img_p/menu_cat.jpg'); background-position:left; vertical-align:middle;}
p.menu_category {padding-left:20px; width:100%}
div.menu_button {width:120px; padding-bottom:2px; text-align:left; color:#000000}
ul, li {list-style:none}
li.list {background : url('img_p/menu_przyc_none.jpg'); height:15px; width:120px; margin-bottom:2px}
li.list:hover {background : url('img_p/menu_przyc_over.jpg'); height:15px; width:120px}
a.list {text-decoration:none; padding-left:18px; width:120px; height:15px}
a.list:link {color:#000000}
a.list:visited {color:#000000}
a.list:active {color:#FF0004}
a.list:hover {color:#FF0004}
/* ]]> */
</style>
</head>
<body>
<div class="container">
<div class="banner">
</div>
<div class="main">
<div class="menu">
<div id="menu_pasek" class="main_pasek"></div>
<br />
<div class="menu_category"><p class="menu_category">Witamy!</p></div>
<div class="menu_button">
<ul>
<li class="list"><a class="list" href="dddd">Strona główna</a></li>
<li class="list"><a class="list" href="dddd">Aktualności</a></li>
<li class="list"><a class="list" href="dddd">Archiwum</a></li>
</ul>
</div>
<div class="menu_category"><p class="menu_category">Szkoła</p></div>
<div class="menu_button">
<ul>
<li class="list"><a class="list" href="dddd">Galeria</a></li>
<li class="list"><a class="list" href="dddd">O szkole</a></li>
<li class="list"><a class="list" href="dddd">Nauczyciele</a></li>
<li class="list"><a class="list" href="dddd">Osiągnięcia</a></li>
<li class="list"><a class="list" href="dddd">Dokumenty szkoły</a></li>
</ul>
</div>
<div class="menu_category"><p class="menu_category">Informacje</p></div>
<div class="menu_button">
<ul>
<li class="list"><a class="list" href="dddd">Zebrania rodziców</a></li>
<li class="list"><a class="list" href="dddd">Konsultacje</a></li>
<li class="list"><a class="list" href="dddd">Lokalizacja</a></li>
<li class="list"><a class="list" href="dddd">Kontakt</a></li>
</ul>
</div>
<div class="menu_category"><p class="menu_category">Inne</p></div>
<div class="menu_button">
<ul>
<li class="list"><a class="list" href="dddd">Forum</a></li>
<li class="list"><a class="list" href="dddd">Księga gości</a></li>
<li class="list"><a class="list" href="dddd">Linki</a></li>
</ul>
</div>
<div class="menu_category"><p class="menu_category">Strona</p></div>
<div class="menu_button">
<ul>
<li class="list"><a class="list" href="dddd">Dodaj do ulubionych</a></li>
</ul>
</div>
<br />
<div id="menu_pasek_bottom" class="main_pasek"></div>
</div>
<div class="text">
<div id="text_pasek" class="main_pasek"></div>
<br />
</div>
</div>
<div class="footer"></div>
</div>
</body>
</html>