3 replies [Last post]
NWillis
Offline
newbie
Santa Monica, CA
Last seen: 17 years 3 weeks ago
Santa Monica, CA
Joined: 2006-01-10
Posts: 5
Points: 0

Somebody please help me before I pull out all my hair and go bald.

My site: http://206.125.214.96/

NN issue: Main content div is below the navigation div as though it's too wide to float. But it's not! Why is it down there?

IE issue: Same as NN issue, PLUS why is the navigation div showing up on top of the header div?

I'm sure that the fix is something ridiculously simple that I cannot see because I've been playing with the files too much.

I know that css file is a monster, but it's nicely commented and all the page layout stuff is right at the top.

Thank you,
Bald and crazy

Tyssen
Tyssen's picture
Offline
Moderator
Brisbane
Last seen: 8 years 15 weeks ago
Brisbane
Timezone: GMT+10
Joined: 2004-05-01
Posts: 8201
Points: 1386

2 column fixed width layout

You need to create an element to contain all the content in your left column - at the moment, you don't have one. Then I'd do this:

#left-column {
float: left;
width: XXpx;
}

#main { 
margin-left: XXpx /* wider than #left-column; no width required */
}

How to get help
Post a link. If you can't post a link, jsFiddle it.
My blog | My older articles | CSS Reference

NWillis
Offline
newbie
Santa Monica, CA
Last seen: 17 years 3 weeks ago
Santa Monica, CA
Joined: 2006-01-10
Posts: 5
Points: 0

2 column fixed width layout

The entire left column is included in the #navcontainer div. The one thing it was missing is the float: left; declaration, which I SWEAR was in there. I must have deleted that line accidentally.

Okay, so that fixes the floating problem, but I'm still have that layering issue in IE. I've tried changing the order of the #header div and #navcontainer divs in the HTML, but that didn't fix anything. I can't use z-index because they're not absolutely positioned divs. Any suggestions for getting the #navcontainer under the #header?

The weird thing is that I had all of this working just fine (for weeks! months, even!), and I didn't change the css file at all, and suddenly the layout broke. ? It's a mystery I suppose.

NWillis
Offline
newbie
Santa Monica, CA
Last seen: 17 years 3 weeks ago
Santa Monica, CA
Joined: 2006-01-10
Posts: 5
Points: 0

2 column fixed width layout

Okay, okay, I got it! Smile

Gratuitous position: relative; attributes, then z-index.

Smile Thanks for your help. It probably would have taken me hours to realize that I had deleted the float: left; line.