Hallo,
Ein Border- / Margin-Problem mit dem IE:
Die Darstellung des untenstehenden Codes ist in Firefox, Opera, Mozilla etc. eigentlich korrekt. Der IE kommt jedoch nicht über den Rand des Elements mit der ID "foobar" hinaus:
Beim ersten Fall (mit #marker) stellt er den Inhalt vom #marker im #foobar dar (nähme ich die Border-Angaben zu ".activefoobar" weg, verhält sich der IE wie beim zweiten Fall).
Beim zweiten Fall (mit text-indetn: siehe kommentare im Code) schneidet er den Inhalt vom #foobar ab bzw. der "hinausgezogener" Teil des Inhalts verschwindet im Nirvana.
Hat jemand irgendeine Idee, was der IE für ein Problem hierbei hat?
Grüße
Thomas
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Untitled</title>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<style type="text/css">
body { padding:0px 0px 0px 25px; margin:0px; }
#content { width:1000px; margin-top:0px; margin-right:auto; margin-bottom:0px; margin-left:auto; }
#foobar { background-color:#99ccff; /*text-indent:-25px;*/ } /*2nd comment in text-indent */
.activefoobar { border:solid 1px #f88113; }
#marker { width:9px; height:17px; padding:0px; margin-left:-25px; margin-bottom:-17px; }
</style>
</head>
<body>
<div id="content">
<br><br><br>
<div id="foobarbox">
<div id="foobar" class="activefoobar">
<div id="marker">>></div><!-- 2dn comment out this -->
<!-- >> --><!-- 2nd comment in this -->
text text text
</div>
</div>
</div>
</body>
</html>