6 replies [Last post]
Big John
Big John's picture
Offline
Enthusiast
Arizona
Last seen: 15 years 42 weeks ago
Arizona
Timezone: GMT-7
Joined: 2003-10-29
Posts: 94
Points: 0

This is to announce that a well known IE bug that doubles
the length of some side margins on some floats has
now fallen! It's a very common problem, so it will
be very useful to know about. See it here:

http://www.positioniseverything.net/explorer/doubled-margin.html
http://www.positioniseverything.net/guests/floatIndent.html

As an old bug hunter I'm stoked. Laughing out loud

http//www.positioniseverything.net/

firstreflex
firstreflex's picture
Offline
Enthusiast
Brooklyn USA
Last seen: 12 years 24 weeks ago
Brooklyn USA
Timezone: GMT-5
Joined: 2003-10-21
Posts: 104
Points: 0

Fix found for old IE margin bug!

I ran into this problem recently. My code looked something like this::

#leftmenu {
   float:left;
	margin-left:20px;
	width:100px; 
	}

I fixed it by wrapping Leftmenu in a div and floating that instead
#leftmenuContainer {
	float:left;
	}
#leftmenu {
	margin-left:20px;
	width:100px; 
	}

You solution looks much cleaner.

Stu
Stu's picture
Offline
Enthusiast
Bristol uk
Last seen: 15 years 30 weeks ago
Bristol uk
Joined: 2004-01-20
Posts: 282
Points: 0

Fix found for old IE margin bug!

Based on this information, I have also found another answer to the 3px left margin error in IE.
I have posted this here http://www.s7u.co.uk/boxes/floatfix.html

It makes use of the IE 'inline-block' style (yet to be taken up by other browsers) but then, they don't have the float problem Laughing out loud

It's not what you do it's the way that you do it.
So do it with STYLE
http://www.s7u.co.uk

Big John
Big John's picture
Offline
Enthusiast
Arizona
Last seen: 15 years 42 weeks ago
Arizona
Timezone: GMT-7
Joined: 2003-10-29
Posts: 94
Points: 0

Fix found for old IE margin bug!

Interesting, Stu! "inline-block;" seems to have the same effect
on IE as "height: 1%;" (in this situation). But IE normally only
supports the inline-block value on spans. I wonder what's
going on?

BTW, Opera does support inline-block on divs, unlike IE.

http//www.positioniseverything.net/

dJomp
dJomp's picture
Offline
Enthusiast
Last seen: 3 years 28 weeks ago
Joined: 2003-03-23
Posts: 422
Points: 0

Fix found for old IE margin bug!

Stu wrote:
It makes use of the IE 'inline-block' style

That's an oxymoron if ever I saw one. Like "Microsoft Works". An inline block? Why not a round square?

You know you're a geek when you try to shoo a fly away from the monitor with your cursor.

Stu
Stu's picture
Offline
Enthusiast
Bristol uk
Last seen: 15 years 30 weeks ago
Bristol uk
Joined: 2004-01-20
Posts: 282
Points: 0

Fix found for old IE margin bug!

Quote:
That's an oxymoron if ever I saw one. Like "Microsoft Works". An inline block? Why not a round square?

Oooooo. :?
I don't think the name has anything to do with Microsoft but is part of CSS2 an CSS3 recommendations.

It's not what you do it's the way that you do it.
So do it with STYLE
http://www.s7u.co.uk

dJomp
dJomp's picture
Offline
Enthusiast
Last seen: 3 years 28 weeks ago
Joined: 2003-03-23
Posts: 422
Points: 0

Fix found for old IE margin bug!

Oh yeah, just read the CSS2.1 spec... It's still a bizarre name, although makes sense once the definition has been read.

As for Microsoft Works... just the first oxymoron that sprung to mind Wink

You know you're a geek when you try to shoo a fly away from the monitor with your cursor.