nicht angemeldet
Hallo an alle,
ich bin nun seit mehr als vier Stunden mal wieder am Verzweifeln ;-(
Folgendes Problem: ich habe zwei <div>s mit der ID box1 und box2. Ich möchte mit "float: left" box1 links von box2 ausrichten.
Wenn ich das mache, entsteht im IE6 in box2 ein ungewolltes padding-left (schaut so aus) von drei px. Man beachte: dieser Abstand entsteht nur für die Höhe von box1. (Sieht man gut in dem grau hinterlegten <p> von box2.)
Dieser Fehler tritt im Netscape7 nicht auf und es schaut somit in beiden browsern dann unterschiedlich aus.
Kann man die Entstehung dieses Abstandes nicht irgendwie vermeiden? Kenn den Bug vielleicht jemand bereits und kann mir einen Workaround anbieten der sowohl im Netscape als auch im IE funzt?
Wäre toll wenn mir jemand helfen könnte.
Anbei noch der Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/transitional.dtd">
<html>
<head>
<style type="text/css">
* {
font-family: Arial, Helvetica, sans-serif;
margin: 0;
padding: 0;
}
#box1 {
width: 180px;
float: left;
background-color:green;
}
#box2 {
background-color:silver;
margin-left: 180px;
}
h1 {
background-color:brown;
}
</style>
</head>
<body>
<div id="box1">
<p>Test test test test test test test test test test test test test test test test test test test</p>
</div>
<div id="box2">
<h1>WWW</h1>
<p>Lorem ipsum dolor lobortis nisl ut aliquip ex ea commodo consequat. Nicht jedes Mittel wirkt in allen Fällen, sondern es muss eine individuelle Lösung gefunden werden. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.</p>
</div>
</body>
</html>