[CSS][PHP]Dziwne rozrzucenie divów w IE Opcje

[karer]

Witam! Po robieniu testowej strony natrafiłem na coś dziwnego, a mianowicie rozrzucenie divów w ie.

Oto screeny:

IE: http://imageshack.us/photo/my-images/687/67517499.png/
Chrome: http://imageshack.us/photo/my-images/11/chromemc.png/



index.php

[PHP] pobierz, plaintext 
<link rel="stylesheet" href="style.css" type="text/css" />
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta http-equiv="Content-Language" content="pl" />
<meta name="Author" content="karer" />
<title>Topspin - wciel sie w tenisiste</title>
 
<div id="box">
 
<center><img src="logo.png" /></center>
 
<div id="lewy">
<div id="pasek">
<center>Menu</center>
</div>
<br/>
<center>
<a href="index.php">Strona główna</a>
<br/>
<a href="informacje.php">Informacje o grze</a>
<br/>
</center>
</div>
 
<div id="srodek">
<div id="pasek">
<center>Informacje</center>
</div>
 
<center>
<br/>
<?
$uchwyt=mysql_connect('localhost','root','kacper')
        or die('Nieudane połączenie z bazą danych...');
mysql_select_db('topspin')
        or die('Nie udało się wybrać bazy danych...');
mysql_query('SET NAMES utf8');
$link=mysql_query("SELECT * FROM news ORDER BY id desc");
 
while($wiersz=mysql_fetch_array($link))
{
		echo '<div id="ramka">';
		echo '<div id="news">';
        echo $wiersz['tytul'];
		echo '</div>';
 
        echo "Data: ".$wiersz['data'];
		echo "<br/>";
        echo $wiersz['tresc'];
		echo '</div>';
		echo "<br/>";
}
mysql_close($uchwyt);
?>
 
</center>
</div>
 
<div id="prawy">
<div id="pasek">
<center>Logowanie</center>
</div>
 
<center>
<br/>
<form style="margin-left: 4%; margin-right: 4%; border: 1px solid;" action="login.php" method="POST">
Login: <input type="text" name="login" id="login" />
<br/>
Hasło: <input type="text" name="haslo" id="haslo" />
<br/>
<input type="submit" value="Zaloguj"/>
</form>
</center>
</div>
 
<br/>
<center>
<div id="stopka">
<center><font size="5"><b>(c) 2012 by karer</b></font></center>
</div>
</center>
</div>
[PHP] pobierz, plaintext 

style.css

[PHP] pobierz, plaintext 
body{
background-color: #808080;
}
 
div#lewy{
border-radius: 20px;
-moz-border-radius: 20px;
-webkit-border-radius: 20px;
behavior:url(border-radius-ie8.htc);
margin-left: 9%;
margin-top: 3%;
height: 50%;
min-width: 15%;
background-color: #999999;
float: left;
}
 
 
a {
color: black;
font-size: 160%;
text-decoration: none; 
}
 
 
div#stopka{
clear: both;
width: 15%;
background-color: #999999;
}
 
div#prawy{
border-radius: 20px;
-moz-border-radius: 20px;
-webkit-border-radius: 20px;
behavior:url(border-radius-ie8.htc);
margin-left: 1%;
margin-top: 3%;
height: 50%;
min-width: 15%;
background-color: #999999;
float: left;
}
 
div#srodek{
border-radius: 20px;
-moz-border-radius: 20px;
-webkit-border-radius: 20px;
behavior:url(border-radius-ie8.htc);
margin-left: 1%;
margin-top: 3%;
margin-bottom: 1%;
height: 50%;
min-width: 50%;
background-color: #999999;
float: left;
}
 
div#news{
width: 99%;
margin-top: 0.5%;
font-size: 160%;
background-image:url('news.jpg');
}
 
div#ramka{
border: 1px solid;
width: 80%;
}
 
div#pasek{
border-top-left-radius: 20px;
border-top-right-radius: 20px;
-moz-border-radius-topleft: 20px;
-moz-border-radius-topright: 20px;
-webkit-border-top-left-radius: 20px;
-webkit-border-top-right-radius: 20px;
-khtml-border-top-left-radius: 20px;
-khtml-border-top-right-radius: 20px;
behavior:url(border-radius-ie8.htc);
 
width: 100%;
background-image:url('pasek.png');
color: black;
font-size: 110%;
font-family:"segoe print"
}
[PHP] pobierz, plaintext 

Ten post edytował karer 28.06.2012, 11:14:56

[krzywy36]

powywalaj <center> i niepotrzebne <br>, ze znacznika <font> też już się nie korzysta. Layout 3 kolumnowy najprościej zrobić tak: wszystkie kolumny (divy) wrzucasz w kolejnego diva i nadajesz mu overflow: hidden; i szerokość. Divom w środku nadajesz konkretną szerokość i float: left. tyle
Jak koniecznie chcesz poprawiać ten kod zamiast napisać nowy, to wrzuć to na jakiś server żeby była wersja "live".

Ten post edytował krzywy36 28.06.2012, 12:52:26

[karer]

http://topspin.zapto.org/

Demko

powywalaj <center> i niepotrzebne <br>, ze znacznika <font> też już się nie korzysta. Layout 3 kolumnowy najprościej zrobić tak: wszystkie kolumny (divy) wrzucasz w kolejnego diva i nadajesz mu overflow: hidden; i szerokość. Divom w środku nadajesz konkretną szerokość i float: left. tyle
Jak koniecznie chcesz poprawiać ten kod zamiast napisać nowy, to wrzuć to na jakiś server żeby była wersja "live".

Dzięki do zamknięcia.