View Full Version : In IE: Floated image is hiding text not taller than itself

10-03-2004, 03:52 PM
In IE (6), the text beside the news icon on the page linked below is hidden.


Now, if I increase the length of that paragraph so it renders as 4 lines or more:


The text is shown. Anyone have any idea what's causing this? I can remove the image and they both show. I can set the image to 50px wide and they both show, but I'm not using 50x50 icons.

Friggin' annoying. Normally I'd just write more verbose descriptions, but this site will be customizable by regular folk, and that blurb text needs to be anywhere from a few words to a few sentences.

Thanks for any help,

10-04-2004, 02:27 AM
Usually I see that with an overflow CSS declaration problem -- however, being on a Mac, I cannot reproduce what you're describing. Got a screen shot I can see?

10-04-2004, 03:53 AM
Looks like an IE issue because the first link (shorter text version) displays fine in FireFox 1.0 pre. where it doesn't in IE 6.01

I composed a screenie to show you what I mean. IE on top, FF on bottom with URLs in pics for reference.

EDIT: I reread the thread title and your post and now realize you realize it's IE only. /me goes back a grade :rolleyes:

10-04-2004, 04:54 AM
I noticed something funny. If you scroll down and scroll back up, it shows. If you move over your tabs however, it dissapears again. BTW, it also makes your "Welcome!" section dissapear. Very peculiar...

/* Edit */

I'm not very good with floats, but have you tried clearing the elements?
Just a suggestion.

10-04-2004, 08:16 AM
Mayhap it's something like the Guillotine Bug or Unscrollable Content Bug listed at the above site? It sure sounds like a clear: both; kind of issue. I'm too tired to look at it in depth right now, but maybe that link will help out. I've seen this kind of thing before and I'm pretty sure it has to do with clearing your floats. I dealt with something like this about 2 months ago and that was the problem for me.

10-04-2004, 01:48 PM

Fixed :) It turns out my blurb element was actually the ideal candidate for that guillotine bug. I actually ended up removing markup (the spacer div) to fix it. Since my container was inside a container of its own, I didn't have to add that annoying clearing element after the container (well I did, but I was able to do it with CSS and :after).

Bottom line is that it works now. Thanks :)