Forum Moderators: not2easy

Message Too Old, No Replies

Peekaboo rendering bug

New solution to the problem

         

DrDoc

2:39 pm on Oct 23, 2003 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



I found something interesting when googling for "peekaboo bug".

I have usually used position: relative; to get rid of the bug, but it appears there's a much better solution. It seems that if the container that holds the float* is given an assigned 'line-height' (any assigned line-height) the bug vanishes. Cool. Testing shows that 'line-height: 1.2em;' generally works well, but in the case of child elements with differing font sizes, it may be necessary to also give them their own line-heights to avoid problems in IE.

* What float? Well, the peekaboo bug is related to floating elements. If you are somewhat unfamiliar with what exactly the bug is, try googling for "peekaboo bug".

BlobFisk

4:32 pm on Oct 23, 2003 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Superb!

Cheers DrDoc!

SuzyUK

7:21 pm on Oct 23, 2003 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Cool Doc... thanks ;)

I always sorted it with explicit widths, but not always the best solution so this tip duly noted, thanks

Suzy