Weblog - 1 items for float

View all
litespeed hosting Ruby on Rails cpanel smtp plesk port 26 email DNS spam rss IE6 float CSS gmail ActiveRecord has many through plugins news subversion migrations shell webmin mail IE7 ssl

Unwanted left and right margins in floating elements in IE6

In IE6 floating elements get assigned a compulsory 3px left and right margin. This is a real pain if you say have 10 images you want to float alongside each other with no margin.

Fix:
You can change their display to inline
ie. style=>"display: inline"
Then they will still have the floating affect but with out the margin.
The next problem is that IE6 will put a margin on the bottom of the bottom row of images (if inside a cell or div tag).

Fix:
Set the height of div or cell to the correct height and the overflow to hidden
ie. style=>"overflow: hidden"

Note: If your containing div is not a set hight you can instead put a div around each image setting the width and height and set overflow to hidden and float these divs instead.