cleared div im Mozilla nach mehreren floatenden Elementen
greh
- css
0 greh
Ich hoffe nicht, zu folgendem Problem ein bestehendes Posting übersehen zu haben, in diesem Falle erbitte ich eine Referenz darauf, denn es erscheint mir unwahrscheinlich, dass ähnliche Probleme nicht schon aufgefallen und diskutiert wurden.
Folgender Quelltext:
#########
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>CSS Problem mit Float / Clear in Mozilla / Firefox</title>
<style type="text/css">
div#head
{background-color:#99FFFF;}
div#fbox
{float:left;
background-color:#99FF99;}
div#content
{background-color:#FF99FF;}
div.clear
{clear:both;}
</style>
</head>
<body>
<div id="head">
<div id="fbox">floatbox</div>
<div class="clear"></div>
</div>
<div id="content">
<p>fortlaufender Text</p>
</div>
</body>
</html>
#########
Eigentlich alles gut, es sei denn, ich entferne das 'X' aus meinem Quelltext. Mache ich das, scheint div.clear nicht mehr korrekt interpretiert zu werden.
(A)
Statt div.clear ein <br style="clear:both;" /> würde da Problem beheben.
(B)
Auch mittels:
div.head
{background-color:#99FFFF;
border:1px solid #FFFFFF;}
ist wieder alles gut.
Aber recht zufrieden bin ich mit den Lösungen nicht, zumal ich erst mal wissen möchte, ob es ich tatsächlich um einen Bug handelt, bevor ich mir eine mehr oder minder aufwendige Lösung einfallen lasse. Der unter:
http://www.positioniseverything.net/gecko/mozbug-clear.html
besitzt gewissen Ähnlichkeiten, aber so richtig ist es das wohl nicht.
Oh, sorry, in meinem Quelltext fehlt das 'X', folglich würde mit obigem Quelltext der beschriebene Fehlerfall eintreten. Gemeint war eigentlich:
##############
...
<body>
X
<div id="head">
...
##############
Danke