Could anyone explain why...

Thread view:

Enable EMail Alerts

Start New Thread

Thread rating:

Chris - 26 May 2005 16:49 GMT

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

Reply to this Message

Steve Pugh - 26 May 2005 17:59 GMT

>#footer ul
>{
[quoted text clipped - 9 lines]
>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

Signature

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

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

Reply to this Message

fleemo17@comcast.net - 26 May 2005 21:31 GMT

>... 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

Reply to this Message

kchayka - 26 May 2005 22:17 GMT

>>... 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.

Signature

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

Reply to this Message

Jasper de Vries - 26 May 2005 21:59 GMT

> Hello
>
[quoted text clipped - 16 lines]
> Thanks
> Chris

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

Regards,
Jasper

Signature

Jasper
http://browservulsel.blogspot.com/

Reply to this Message

Webmaster Forum / HTML, CSS, Scripts / CSS / May 2005

Could anyone explain why...