IE zerschießt mal wieder DIV-Layout
pep78
- css
Hallo,
Firefox, Opera und Netscape zeigen das Layout richtig an,
nur der IE zerschießt es mal wieder ;(
So muss es richtig aussehen:
http://www.imageuploader.de/p/2c86409600d6183583b7a86173abf537.png
Der IE macht aber zwischen den linken und rechten Buttons
nicht nur 3 Pixel sondern 6 Pixel Abstand, demzufolge passt
es nicht mehr ins große DIV rein und wird zerschossen
dargestellt.
Wenn man die Angabe margin-right:3px; /* abstand */
rausnimmt, wird es im IE richtig dargestellt, bei den
anderen Browsern kleben dann aber die Buttons zusammen.
Weiß jemand wie man diesen "Bug" fixen kann?
Danke!
pep78
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html><head>
<style type=text/css>
div{
font-family:verdana;
font-size:8pt;
}
.links{
width:90px;
background:#f3d9d0;
border:1px solid #8f0000;
font-weight:bold;
padding:2px;
padding-left:5px;
margin-right:3px; /* abstand */
float:left;
}
.rechts{
width:163px;
background:#f3e9e0;
border:1px solid #d29761;
padding:2px;
margin-bottom:3px;
padding-left:5px;
overflow:hidden;
}
</style>
</head>
<body>
<table border=0 cellspacing=0 cellpadding=0>
<tr>
<td style=width:468px;vertical-align:top>
<div style=width:185px;float:left;background:green>
Test<br>
Test<br>
Test<br>
Test<br>
Test<br>
Test<br>
Test<br>
Test<br>
</div>
<div style=width:274px;margin-left:188px>
<div class=links>99 pixel</div><div class=rechts>172 pixel</div>
<div class=links>links</div><div class=rechts>rechts</div>
<div class=links>links</div><div class=rechts>rechts</div>
<div class=links>links</div><div class=rechts>rechts</div>
<div class=links>links</div><div class=rechts>rechts</div>
<div class=links>links</div><div class=rechts>rechts</div>
</div>
</td>
</tr>
</table>
</body>
</html>
hi,
Der IE macht aber zwischen den linken und rechten Buttons
nicht nur 3 Pixel sondern 6 Pixel Abstand
The IE Doubled Float-Margin Bug
gruß,
wahsaga
Hallo pep,
»
.rechts{
width:163px;
background:#f3e9e0;
border:1px solid #d29761;
padding:2px;
margin-bottom:3px;
padding-left:5px;
overflow:hidden;
}
gebe mal deiner .Rechts Klasse ein: float:left;
mit. Auf meinen beiden Browsern IE und FF wird eigentlich nichts mehr zerschossen.
mfg dennisb