Firefox background-attachment & float

Forum Moderators: not2easy

Message Too Old, No Replies

Firefox background-attachment & float

Stingus

4:36 pm on Sep 9, 2005 (gmt 0)

This is the code:
<style>
body {
margin: 0px;
}
#container {
width: 780px;
margin: 0px auto;
background-image: url(/pics/Bg-Attachement.jpg);
}
#float-div {
float: left;
}
</style>
</head>
<body>
<div id="container">
<p>The wolf is grey</p>
....
<div id="float-div">The rabbit is white</div>
</div>
</body>

In IE the background covers the hole content of the page (eg "The rabbit is white" has the background) but in FF the background stops when the "float-div" is rendered. I know it's because of the float and if I give "container" a height it should work in both browsers but I can't do that since I don't know the height of all pages. I want the height to depend on the content and should not be fixed.
Is there a hack to that?

Setek

5:28 am on Sep 12, 2005 (gmt 0)

Put a <br style="clear: both;" /> after your floating div - it'll have browsers acknowledge the floating element and expand the containing div past it.