I've got an image floated to the right of a heading which is taller than the text it is placed next to. In IE7 it looks how I want it too look with the heading area seeming to stretch down with the image, but in Firefox 3 the image overlaps onto the div below.
The example here:
How can I get it to behave as it does in IE?
All the HTML and CSS is in the page source.
Pepe, the bull
07-11-2008, 09:00 PM
I believe floated items should not stretch the div they are in. They're like floating over it. (That's how it works in my head.) You could put a div after the pic and clear the float.
<h2><img src="page2.php_files/me3%2520400.JPG" id="richard" alt="Richard">Get in contact with rgtest at <b class="rsd">rgtest</b> in any of the following ways:</h2>
<div style="clear:both;"> </div>
That's worked, so I'll stick with that and remember your way of thinking about it. Just wondering if that's a fully accepted way of doing it and are there other ways?
07-12-2008, 12:55 AM
Read this for more info on the proper way to clear floats. http://positioniseverything.net/easyclearing.html
Why are you using so much absolute positioning? Most of it if not all of it is uneeded. Use floats, margins and/or paddings to get things where they want. Don't abuse absolute positioning.