The disappearing text act
I’ve heard of IE having difficulty with text inside of floating elements. Now, I get to deal with this problem first hand. I’ve been getting a couple of complaints about the text on my site not showing up in places until you select it or hover over it. I know this problem is related to the CSS and floating elements, but I don’t know how to fix it (or if you can). I’m guessing IE7 works a little better, but there are still a lot of people who don’t have IE7.
The latest of my reading suggested putting a “position” with every “float” in the CSS (I’m guessing position: relative?). Before I go through and add that to all of my floating elements, I was wondering if anyone else has a better solution, or knows if the “position/float” combination will fix this??? Please leave a comment if so. Thanks.
Chris Tuesday, 24 Oct, 2006 Posted at 02:58PM
Sounds like the “peekaboo” bug. Usually, it can be fixed by adding a container to the element, setting it’s height:
* html #container-element { height: 1%; }See if that helps.
Ryan Tuesday, 24 Oct, 2006 Posted at 08:07PM
Ok, thanks. I put a container around all of the suspicious peekaboo’s, and it appears to be working correctly now. Seems as though this is a pretty well-known problem.