7 replies [Last post]
ardmoretreasures
Offline
Regular
winston salem, nc
Last seen: 13 years 30 weeks ago
winston salem, nc
Joined: 2006-12-15
Posts: 32
Points: 0

Hey guys, here's another layout issue. In FF this 3 column layout seems to work fine but in IE6 it looks like it adds a 100px lft margin to one of the divs blowing out the design to the right. I am using negative margins and have played around with changing these margins etc. but no luck. Any ideas? Thanks again!

http://dot07.powweb.com/index.php

ClevaTreva
ClevaTreva's picture
Offline
Guru
A hilly place, UK
Last seen: 3 years 4 weeks ago
A hilly place, UK
Joined: 2004-02-05
Posts: 2902
Points: 0

Hi This may be the double

Hi

This may be the double margin bug in ie:

double margin fix

Trevor

wolfcry911
wolfcry911's picture
Offline
Guru
MA, USA
Last seen: 7 years 39 weeks ago
MA, USA
Timezone: GMT-5
Joined: 2004-09-01
Posts: 3224
Points: 237

sounds like the IE double

sounds like the IE double margin bug. Try adding (or changing in your case) display: inline to the floats with a left margin.

ardmoretreasures
Offline
Regular
winston salem, nc
Last seen: 13 years 30 weeks ago
winston salem, nc
Joined: 2006-12-15
Posts: 32
Points: 0

I tried that and the width

I tried that and the width is right but now all my content is at the bottom in FF and nothing in IE. http://dot07.powweb.com/index.php

wolfcry911
wolfcry911's picture
Offline
Guru
MA, USA
Last seen: 7 years 39 weeks ago
MA, USA
Timezone: GMT-5
Joined: 2004-09-01
Posts: 3224
Points: 237

you missed the #content div

you missed the #content div - although I can't figure why things went wonky in FF... Sad

ardmoretreasures
Offline
Regular
winston salem, nc
Last seen: 13 years 30 weeks ago
winston salem, nc
Joined: 2006-12-15
Posts: 32
Points: 0

Still no luck. I got the

Still no luck. I got the basic layout from here http://blog.html.it/layoutgala/LayoutGala07.html
and modified it. I removed the "wrapper" DIV because it didn't seem to make sense why it was there, it closes right after the Content DIV. But when I keep it you can't click on anything. ????

wolfcry911
wolfcry911's picture
Offline
Guru
MA, USA
Last seen: 7 years 39 weeks ago
MA, USA
Timezone: GMT-5
Joined: 2004-09-01
Posts: 3224
Points: 237

the wrapper was there to

the wrapper was there to contain the three floating columns. The fact that it was floating itself makes it contain floating children. You've added the display:inline to #content, but now it has no float. Just to clarify, technically an element that has been specified to float should not contain a display rule as well (like you had had (float: left; and display: block;)). The display rule is being overruled by the float. The only reason to add the display: inline is that for some strange reason it corrects IE's double margin bug.

What I would do is back up to where you were before your post, keeping the wrapper, and simply change the display: block to display: inline in the columns.

ardmoretreasures
Offline
Regular
winston salem, nc
Last seen: 13 years 30 weeks ago
winston salem, nc
Joined: 2006-12-15
Posts: 32
Points: 0

Yeah sometimes you just have

Yeah sometimes you just have to start over. I think I've got it working pretty good, I also am using the "voice hack" for IE for these exact column widths, etc. Thanks again for all your help!