Could anyone explain why...

[Chris]

Hello

Could anyone explain why the following:

#footer ul
{
float : left;
margin : 2px 0px 7px 28px;
padding : 0px;
width : 360px;
list-style : none;
}

behaves as it should in all browsers except IE6 Win? On IE6 Win the
list appears further to the right than it does in all other major
browsers. Its the amount of space (left-margin) which varies. Maybe I
am missing something really obvious!?

Thanks
Chris

[Steve Pugh]

"Chris" <ab****@bangor.ac.uk> wrote:

#footer ul
{
float : left;
margin : 2px 0px 7px 28px;
padding : 0px;
width : 360px;
list-style : none;
}

behaves as it should in all browsers except IE6 Win? On IE6 Win the
list appears further to the right than it does in all other major
browsers. Its the amount of space (left-margin) which varies. Maybe I
am missing something really obvious!?

When you apply a margin on the same side as a float (i.e. a left
margin on a left floated element or a right margin on a right floated
element) IE doubles the size of the margin.

Solutions: avoid setting margins on the same side as the float OR use
a hack to give IE a value for the margin half the size that it should
be.

Steve

--
"My theories appal you, my heresies outrage you,
I never answer letters and you don't like my tie." - The Doctor

Steve Pugh <st***@pugh.net> <http://steve.pugh.net/>

[fleemo17]

>... use a hack to give IE a value for the margin half the size that it should be.<

That just might solve my latest problem with IE too. How about
providing the hack?

-F

[Jasper de Vries]

Chris wrote:

Hello

Could anyone explain why the following:

#footer ul
{
float : left;
margin : 2px 0px 7px 28px;
padding : 0px;
width : 360px;
list-style : none;
}

behaves as it should in all browsers except IE6 Win? On IE6 Win the
list appears further to the right than it does in all other major
browsers. Its the amount of space (left-margin) which varies. Maybe I
am missing something really obvious!?

Thanks
Chris

That's the double margin bug. Fix it by adding "display: inline;" to
your CSS rules.

Regards,
Jasper

--

Jasper
http://browservulsel.blogspot.com/

[kchayka]

fl******@comcast.net wrote:

... use a hack to give IE a value for the margin half the size that it should be.<

That just might solve my latest problem with IE too. How about
providing the hack?

Just bookmark this page:
<URL:http://www.positioniseverything.net/explorer.html>

You'll see the double-margin bug listed there, among other bizarre
behaviors.

--
Reply email address is a bottomless spam bucket.
Please reply to the group so everyone can share.