Fixing the IE z-index bug.

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: ![Screen shot 2010-05-13 at 12.15.21 PM.png](images/Screen shot 2010-05-13 at 12_15_21 PM.png) The fix is to give the parent of the element with a z-index a slightly higher z-index

CSS Styling Input Radio Form Controls with Labels above buttons

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.

An Solution To Clearing Floats

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.