A div issue in IE 7 - I think

HTML & CSS
1

Just looked at this in browsershots and the main content area is below the page.

<snip>

I don’t have access to Windows right now. …any advice is appreciated.

2

Hi, yes you have a flolat drop.

On #main you give it a left margin equal to the width of the left column. Normally that is done to ensure the right column can extend to the full extent of the width. Er…extend to the full dimensions of the parent lol :slight_smile:

However you also set a width. Redundant :).

Just float it and remove the margin and see if that patches it up


#main{float:left;margin:0;}
3

Thanks - I think that resolved the issue. However, I’m not clear on your explanation. Why does a margin + width cause the drop? Where would I find info about this? I thought it’s only necessary to float the left col since it works in FF/Saf

4

Hi, ok, so take htis for example
http://www.pmob.co.uk/temp/2colfixedtest_4.htm

The right column is a fluid width (it just has a left margin that equates to the left columns width, just as you had the margin)

In that case (if the left margin is set on the right column+ it isn’t floated) then it will slide around the float and allow it to expand to the entire parents width. Quite a nice effect :).

That’s normally how a 2column layout goes (that right column fluid layout anyway, lets keep it simple). So to keep the right column fluid a left margin is set and thus it will stay away from the left column and just continue to take up the remaining width. However you set a width thus making that nice effect very ruined. Thus since you had a width, we couldn’t do that effect. I considered hte possibility you wanted the width more then anything, so I removed the left margin and floated it so it was just 2 floats side by side.

I hope you understand lol :). I tried to be concise and clear.

5

Thanks…

I didn’t want the main column to be fluid width since it’s a fixed with layout and negative space in the content area (right side) is important. Assigning a width seemed to achieve that desired space (at least in FF/Safari). I didn’t want to float it because then I have to start floating everything else.

6

No you wouldn’t have :). Why do you think that?