Create boxes with a semi-transparent background while keeping the content (images/text) opaque.

http://www.dedestruct.com/2008/03/06/how-to-cross-browser-css-transparent-divs-with-opaque-content/

IE6 seems to double it’s margins on floated elements… Why? Who cares… Here’s how you fix it!

Just add display: inline; to the floated element!

I found it here: http://www.jaymeblackmon.com/ie6-double-margin-bug-fix

So you’ve put together a CSS template with a body background color. We’ll use #4C4C4C. Your CSS template contains a content area that is a different color. We’ll use #000000. In simple form that looks like this:

body {
    background-color: #4C4C4C;
}
#content {
    width: 700px;
    margin: 0 auto;
    background-color:#000000;
    color: #FFFFFF;
}

Now if your content area is black, wouldn’t it be nice to edit your content in TinyMCE on a black background? Assuming you have TinyMCE importing your sites stylesheet, here is the trick:

* .mceContentBody {
    background: #000000;
}

That’s it!  Super easy.  If you have a better way of doing this feel free to comment.

This is a quick and easy trick/fix for correcting the css min-height problem in IE6.  It is pure CSS and does not require any additional div’s.  Here’s the code:

selector {
  min-height:500px;
  height:auto !important;
  height:500px;
}

That’s it! This trick should be compatible with: IE6, IE7, Mozilla/Firefox/Gecko, Opera 7.x+, Safari1.2

This is not compatible with IE5.5, but with less than 0.01% of my visitors using it I am not overly concerned about implementing this fix on most sites.

You can view Dustin Diaz’s original article here.