mam stronę zbudowaną na divach. W skrócie składa sie ona z następujących elementów: nagłówek, 2 kolumny (lewa - menu, prawa - treść strony)i stopka. Kolumny mają odpowiednio float: left i right. I tu zaczyna się mój problem - pod FF i straszymi wersjami IE prawa kolumna nie trzyma rozmiaru (określony jest w pikselach) i "rozlewa" się się na bok, spychając w dół lewą kolumnę z menu. Problem nie występuje jedynie pod IE 7.0. Nie wiem, jak temu zaradzić, juz od dwóch dni próbuję na rózne sposoby - nic nie działa...
W Was nadzieja jeszcze mi pozostała.
Oto kod:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-2">
<link href="style.css" rel="stylesheet" type="text/css">
</head>
<body>
<div id="content">
<div id="content_main">
<p>content_main - content_main</P></div>
<div id="nav_bar">nav_bar - nav_bar</div>
<div id="clear_footer"></div>
<div id="header">
<div id="top_nav"></div>
</div>
<div id="footer">stopka stopka stopka stopka stopka</div>
</div>
</body>
</html>
____________________
I jeszcze CSS:
/* Ukryj przed Mac/IE commented backslash v2 \*/
html, body { height:100%}
/* koniec łatki */
body {padding: 0;
margin: 0 0 0 0;
background: #cccccc url(images/body_bg.jpg) repeat-x;
color: #333333;
text-align: center;
min-width: 766px;
font: 90%/170% Verdana, Arial, Helvetica, sans-serif;
list-style-type: disc;}
#content{ position: relative;
height: 50%;
min-height: 50%;
width: 764px;
background-color: #ff9966;
color: #333333;
margin: auto;
text-align: left;}
#header{ position: absolute;
top: 0;
width: 764px;
height: 210px;
background: #D0E0FF url(images/header.jpg) no-repeat;}
#nav_bar {float: left;
position: relative;
width: 209px;
margin-top: 210px;
padding-top: 12px;
padding-bottom: 30px;
background-color: #ccff66;
background-repeat: repeat-y;}
#content_main {width: 550px;
float: right;
position: relative;
padding-top: 215px;
padding-right: 20px;
padding-bottom: 32px;
padding-left: 22px;
background-color: #66ccff;}
#clear_footer {/* czyści obszar dla stopki */
width: 100%;
height: 5px;
clear: both;
background-color: #3366ff;}
#footer {clear: both;
position: relative;
width: 764px;
height: 50px;
background-color: #cc33cc;
text-align: center;
border-top-width: 1px;
border-top-style: dotted;
border-top-color: cccccc;
top: auto;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
padding-top: 5px;
color: #CCCCCC;}
#top_nav {display: inline;
position: absolute;
left: 0px;
top: 177px;
background-color: #3366ff;}
/* ŁATKI */
html > body #content{height: auto; /* dla Mozilli, IE zawsze traktuje height jako min-height*/ }
* html #footer { /* Style tylko dla IE */
height: 52px; /* dla IE5 */
height: 50px; /* dla IE6 */}
/* KONIEC ŁATEK */
_____________________
Dajcie mądrą radę cóż mnie robić
?
Pozdr!