Welcome to WebmasterWorld Guest from 54.147.20.131

Forum Moderators: not2easy

Message Too Old, No Replies

Negative Margins Clipped in IE6

Why do I need extra code for IE6?

     

erdy

11:47 am on Nov 10, 2006 (gmt 0)

5+ Year Member



Why is it that when I use negative margins on an image in IE6 it clips the image so you only see the part of it that is in the containing DIV?
I understand that
position: relative;
on the img selector sorts this out, but how? is it just an unexplainable quirk?

You also need to put in

display:block;
on the img selector which I also donít understand.
If anyone could explain these hacks to me I would be very grateful.

Thanks

Erdy.

yuval_raz

1:08 pm on Nov 12, 2006 (gmt 0)

5+ Year Member



hi erdy,
this is yet another problematic IE rendering bug. it caused me a nasty headache when i tried giving an element negative top margins while using a png background (links didn't work when position: relative; was given).

had to re-write the whole code...

if this is the only element in the flow you can also use the position: relative and give it negative offsets instead of negative margins.

about the display: block for the image tag - it comes in handy when you understand that IE render images as text, and leaves some space at the bottom for the "big" letters (q, g etc'). when giving the element the display: block; property you turn the image tag into a block type element, thus aborting IE's abuse of the image tag.

i hope this helps,

yuval

erdy

1:04 pm on Nov 13, 2006 (gmt 0)

5+ Year Member



This does help.
Thanks for the explanation about the Img tag.

Erdy.

 

Featured Threads

Hot Threads This Week

Hot Threads This Month