So, I've tried making the making the content area on a page adjust to the height of the content. I tried using the height property and setting it to 100% but it just messes up the page. I can only get the page to work if I use a set px height.

height:100% is not a valid value for height in this location; px would be. 100% of what? What are you trying to do?

Why is the footer floating beside that "New Start" message? A clue: your html is badly broken. Fix that, then call us back.

BrianBam
—
2012-09-26T19:29:56Z —
#3

I don't think its that bad. A lot of those error messages are related to code generated by wordpress. Well, if anyone is capable of helping then just let me know.

dresden_phoenix
—
2012-09-26T20:10:56Z —
#4

So, I've tried making the making the content area on a page adjust to the height of the content.

this happens by default. what is it that you really want to happen?

I tried using the height property and setting it to 100% but it just messes up the page.

Setting the height to 100% sets that element to the height of the PARENT element IF (and only if) that parent element has a set height. Also remember that 100% height will overflow or cause scroll bars if you ad vertical padding or margins on top of the 100% height.

In short, you need to declare a fix height somewhere , before you use %

Any suggestions?

BrianBam
—
2012-09-26T22:30:10Z —
#5

Thanks for the response dresden_phoenix.

So, what I do want is the #BelowHeaders section to adjust according to the content within it.

So, I set the #MainContent height to 4000px which is what I had it at originally, but the problem is that I have too much blank space at that height. I need more height on some pages vs others. However, I'd just like it to adjust according to the content in the #MainContent area which is most likely dictated by the content in the

#MainLeftcontent { width: 625px; float:left; padding-left:2%;

}

since the #RightNav height won't change that much. However, just like you said ( dresden_phoenix)

Setting the height to 100% sets that element to the height of the PARENT element IF (and only if) that parent element has a set height.

the #rightNav is following the behavior and I'd like to do the same for the #MainLeftcontent as a whole.

what you want (technically) really cant be accomplished with divs/css. It's not the way they work.

Now, what you want aestetically9 unless my understanding is off is EQUAL HEIGHT COLUMNS ( tongs of tutorials on that out there ) Basically there are TWO WAYS.

First we get rid of those height declarations, as i said before that not the way DIVs and CSS work.then you create a SMALL bg graphic which you will assign to the container of both your divs, and repeat vertically. That really is the easiest way.