The original issue has been fixed, but now the content div is resting beneath the entire wrapper. Does anyone see why the content div is being forced out of the wrapper?

>>>>

Hi,

Can someone give me a clue as to why the wrapper section of this page isn't displaying a solid white background? My original template was hacked by someone else and now I can't find the bug that is causing the wrapper div to display without a solid white bg so it doesn't break up the nested divs with the dark gray bg.

reference link

Thanks a lot.

lex

div.wrapper { 
 position: relative;
 width: 973px; 
 background-color: #ccc;
 font-size: 11px;
 line-height: 15px;
 color: #333;
 font-family: Helvetica Neue, Verdana, Arial, Helvetica, sans-serif;
 text-align: justify;
 margin: 0 auto;
}

Change the bolded part to background-color: #FFFFFF .

Like I said, the background color issue (the original issue) has been resolved. I'm trying to figure out why the content div is being forced below the wrapper.

My colors are as such to show the different divs and their placement.

Ohhhhh. I thought you meant the wrapper was the wrong colour.

Hang on, I'll look again.

Thanks a ton.

Ahhh...I see why. Dude, whoever hacked at this was a butcher.

This is a layout that could easily be done with floats and using no positioning whatsoever. Basically, you make your containing div, float one div to the left, one to the right and Bob is your uncle.

The BEST thing you can do for yourself is to strip down your code and reconstruct it from the outside in. Start with your shell...put your wrapper in place, then add your left nav, then your right side, and THEN fill in your content. At that point, things will be a lot leaner, meaner, and clearer.

Simply put, your code is a mess.

Figures. I thought this would be a quick graphics update, but things were far worse when I got into it. Thanks for the help.

Originally Posted by ADAM Web Design

Change the bolded part to background-color: #FFFFFF .

It is shorter and better to use "background: #fff;" instead of using "background-color: #ffffff;"

Background: #fff; is just "shorthand" for background-color: #ffffff -- same same.

I'm still at a loss. Mind taking another look?

link 2

You need to set nav to float: left as Adam suggested. Give .content a left margin wide enough to push it past the .nav section. Clear your floats.

This might help:
Floatutorial: Step by step CSS float tutorial

Originally Posted by LadynRed

Background: #fff; is just "shorthand" for background-color: #ffffff -- same same.

Less coding means less time to load and less using of bandwidth.

If you use this methods whole your css you can save a lot bytes.