IE6 Float Bug

Lots of people like CSS and it certainly has it’s place. But when the most popular browser has a bug that prevents a simple div element from displaying properly we all get frustrated. All I wanted to do was have a box “float” to the right side of the page. It works great in IE7 and Firefox. IE6 displayed the box in the content area instead of to the right. See this page for more details. But the simple answer is add “display: inline” to the style. As I understand this, we are using a bug in IE6 to correct another bug in IE6. Okay, I grant you, this is confusing.

To fix the IE6 “float” bug to this:

<div class=”box”>
   <div class=”sidebar” style=”float: right; display: inline“>content