nicht angemeldet
Hallo,
aufgrund von Hinweisen in einem anderen Thread, haben ich die Umsetzung meines Layouts von Tabellen auf divs und CSS umgestellt. Der (zugegebenermaßen sicher noch lange nicht perfekte) Code sieht folgendermaßen aus:
------------------
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled</title>
<style>
body {margin: 0px 0px 0px 0px;}
.page {
width:768px;
background-color:#d9d9d9;
border:1px solid gray;
}
.header_container {
width:768px;
height:140px;
background-color:#ffffff;
}
.headerpic {
float: left;
width: 140px;
background-color:#ffffff;
clear: left;
}
.headerlogo {
float:right;
margin-top:75px;
margin-right: 5px;
background-color:#ffffff;
clear:right;
}
.menu1_container {
clear:both;
width: 768px;
background-color: #D9D9D9;
}
.menu1 {
height: 16px;
font-family: Arial, Verdana;
font-size:12px;
margin-left: 0px;
padding-left: 140px;
border-top:1px solid gray;
}
.main_container {width: 768px;}
.menu2 {
float:left;
width: 140px;
max-width:140px;
overflow:hidden;
background-color:#2A296E;
font-family:Tahoma, Arial, Verdana;
font-size:12px;
color:#ffffff;
padding:3px;
}
.content {
margin-left:140px;
padding: 5px;
background-color:#ffffff;
border-left:1px solid gray;
border-top:1px solid gray;
border-bottom:1px solid gray;
font-family:Tahoma, Arial, Verdana;
font-size:13px;
}
.adresse {
position:absolute;
bottom:0px;
left:0px;
width:140px;
padding:3px;
max-width:140px;
font-family:Tahoma, Arial, Verdana;
font-size:9px;
}
.footer_container {
position:relative;
top:0px;
left:0px;
width: 768px;
background-color: #D9D9D9;
}
.footer {
width:768px;
text-align:right;
padding-right:5px;
height: 16px;
font-family: Arial, Verdana;
font-size:12px;
}
</style>
</head>
<body>
<div class="page">
<div class="header_container">
<div class="headerpic"><img src="pics/produktion.jpg"></div>
<div class="headerlogo"><img src="pics/knopp.jpg"></div>
</div>
<div class="menu1_container">
<div class="menu1">
| Unternehmensgruppe | Produkte | Aktuelles | Karriere |
</div>
</div>
<div class="main_container">
<div style="position:relative;">
<div class="menu2">
Muster GmbH<br />
Muster Vertriebs GmbH<br />
Entwicklung<br />
Partner<br />
</div>
<div class="content">
<p>Contentbereich</p>
</div>
<div class="adresse">
Muster GmbH<br />
Postfach 80<br />
D-12345 Musterstadt<br />
Tel: +49(0)0000/0000-0<br />
Fax: +49(0)0000/0000-66<br />
info@muster-gmbh.com<br />
www.muster-gmbh.com
</div>
</div>
</div>
<div class="footer_container">
<div class="footer">
Kontakt | Impressum
</div>
</div>
</div>
</body>
</html>
------------------
Mein Problem stellt such nun so dar, dass Firefox den Adressbereich korrekt darstellt, der Internet Explorer jedoch nicht. Anbei ein Screenshot, der verdeutlicht, was ich meine. Der IE scheint die Positionierung anders zu interpretieren. Wenn ich die Position der Adresse auf left:-140px; setze, dann zeigt es der IE korrekt an und er Firefox natürlich nicht.
Hat jemand eine Lösungsmöglichkeit parat oder kennt eine bessere Lösung?
Eine weitere Frage bezieht sich auf den Contenbereich: Warum rückt der IE den ersten Absatz des Contents stärker ein, als den restlichen Text?
Viele Grüße,
Tobias