We all know that IE is full of bugs and just plain sucks as a browser… if you didn’t know that you can drop your geek badge off on the way out. So today I ran across the Z-Index bug in IE7. Sometimes you’ve seen this behavior before:  The fix is to give the parent of the element with a z-index a slightly higher z-index

I just wanted a nice way to style my radio buttons sort of inline, but with the labels above the radios. Here is how I accomplished this. ul { overflow: auto; padding: 2px 0;} ul li { float: left; text-align: center; margin: 0 10px} ul label { display: block;} Line one clear the floats after the UL. Line two floats the LI. Line three displays the label as a block.

Just an FYI, note to myself, use a css validator to catch little CSS problems that will most likely choke IE6. http://jigsaw.w3.org/css-validator/

I used to clear floats by adding the CSS style clear: both to the element underneath the floating elements. This was a pain because sometimes you had to add a tag under it with the clear: both set. Then while searching for a better way (there is always a better way) to clearing floats I found the overflow rule. Essentially, just add overflow: hidden to the parent of the floating elements.