ich habe mir mit hilfe von css eine Seite mit einem Header, links darunter ein Menu und recht vom Menu ein Content-Bereich gemacht. Das Menu hat links einen Seitenabstand von 20px und eine Breite von 200px. Der Content-Bereich hat einen Seitenabstand von 220px und ist im FF direkt neben dem Menu. Der Ie stellt das ganze ein bisschen anders dar, er verschiebt das Menu ein Stück nach recht und zwischen Menu und Content ist ein kleiner Streifen weiß. Die beiden Browser scheinen Pixelangaben verschieden zu interpretieren. Wie schaffe ich es, dass die Seite in beiden Browsern gleich aussieht?
Hier noch der Code zum selber angucken:
index.html
- Code: Select all
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
</head>
<link href="style.css" rel="stylesheet" type="text/css" />
<body>
<div class="header"><img src="logo.png" height="150"></div>
<div class="navigation"></div>
<div class="content"></div>
</body>
</html>
style.css
- Code: Select all
body {
/*background-color: #FFFF00;*/
min-width: 990px;
min-height: 600px;
}
div.header {
height: 150px;
margin-left: 20px;
margin-right: 20px;
margin-top: 10px;
padding-left: 5px;
background-color: #FF9000;
}
div.navigation {
width: 200px;
height: 700px;
margin-left: 20px;
background-image: URL("menu.png");
float: left;
}
div.content {
height: 700px;
margin-left: 220px;
margin-right: 20px;
background-color: #FFFF00;
}
