468,525 Members | 2,181 Online
Bytes | Developer Community
New Post

Home Posts Topics Members FAQ

Post your question to a community of 468,525 developers. It's quick & easy.

Could anyone explain why...

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

Jul 21 '05 #1
4 1503
"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/>
Jul 21 '05 #2
>... 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

Jul 21 '05 #3


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/
Jul 21 '05 #4
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.
Jul 21 '05 #5

This discussion thread is closed

Replies have been disabled for this discussion.

Similar topics

13 posts views Thread by C++fan | last post: by
21 posts views Thread by Gactimus | last post: by
2 posts views Thread by Alek Davis | last post: by
3 posts views Thread by wesley.hall | last post: by
1 post views Thread by Andrew | last post: by
By using this site, you agree to our Privacy Policy and Terms of Use.