Subject: [css-d] image float right issues in IE5.5 win

From: valleyofmalls at yahoo.com (David Norris)
Date: Fri, 25 Apr 2003 14:31:36 -0700 (PDT)

I have sliced up an image and floated it right inside a table using the method here http://www.meyerweb.com/eric/css/edge/raggedfloat/demo.html I'm using the style code as follows on my slices:img.slices {float: right; clear: right; margin: 0 0 0 0;} (I have enough white space on the sliced images that I don't need to add any margin for the text wrap) Looks fine it seems everywhere except IE5.5 windows, not sure about mac. In IE 5.5 there's some space between the images and the right edge of the table so it won't meet up with the edge. But if I add some negative px or em to the right margin it looks fine in IE 5.5, the image goes flush to the edge. example: img.slices {float: right; clear: right; margin: 0 -3px 0 0;} img.slices {float: right; clear: right; margin: 0 -1em 0 0;}  Is there an IE 5.5 hack or something for this?  

---------------------------------
Do you Yahoo!?
The New Yahoo! Search - Faster. Easier. Bingo.From holnkids at netscape.net  Fri Apr 25 23:26:08 2003
From: holnkids at netscape.net (Holly Bergevin)
Date: Fri, 25 Apr 2003 18:26:08 -0400
Subject: [css-d] image float right issues in IE5.5 win
Message-ID: <[email-masked]>

David Norris <[email-masked]> wrote:

>I have sliced up an image and floated it right inside a table using the method here http://www.meyerweb.com/eric/css/edge/raggedfloat/demo.html I'm using the style code as follows on my slices:img.slices {float: right; clear: right; margin: 0 0 0 0;} (I have enough white space on the sliced images that I don't need to add any margin for the text wrap) Looks fine it seems everywhere except IE5.5 windows, not sure about mac. In IE 5.5 there's some space between the images and the right edge of the table so it won't meet up with the edge. But if I add some negative px or em to the right margin it looks fine in IE 5.5, the image goes flush to the edge. example: img.slices {float: right; clear: right; margin: 0 -3px 0 0;} img.slices {float: right; clear: right; margin: 0 -1em 0 0;}  Is there an IE 5.5 hack or something for this? 

Hi David - If you know it is only IE5.5 (and not IE6 also) that is doing this, you can use the Tan hack [1] to feed the negative right margin to IE5.5 which would look like this -

img.slices {
    float: right; 
    clear: right; 
    margin: 0; /* Margin settings for most browsers */ 
    }

* html img.slices { /*Only IE browsers see this (including Mac)*/
    margin-right: -3px; /* Set value for IE5.5 */
    ma\rgin-right: 0; /* Reset value for IE6 and IE5-Mac */
    }

Otherwise (if IE6 needs the negative margin as well), try setting the "incorrect" value in the regular selector and use the child selector to reset it for the other browsers -

img.slices {
    float: right; 
    clear: right; 
    margin: 0 -3px 0 0; 
    }

html>body img.slices {margin-right: 0; }

HTH,

~holly

[1] See: "A Modified SBMH" -
     http://css-discuss.incutio.com/?page=BoxModelHack

__________________________________________________________________
Try AOL and get 1045 hours FREE for 45 days!
http://free.aol.com/tryaolfree/index.adp?375380

Get AOL Instant Messenger 5.1 for FREE! Download Now!
http://aim.aol.com/aimnew/Aim/register.adp?promo=380455