CSS content box auto-expansion. help!

M

Malikman

[H]ard|Gawd
Joined
Sep 1, 2004
Messages
1,045
Hello,
i have a website here...
http://mysite.verizon.net/malikfam/ben/howmuchmoneyisavailable.html

the gray navbar is a content box in css and the white text area is a content box in css.

I can gt both of them to expand with the content of the text in the content box BUT if you look at the frequently asked questions page or maybe a few others sometimes there's so much text that the white will expand so far but the gray won't expand at all. Is there a way to get htem to auto expand TOGETHER, even though they are seperate content boxes?
 
Basically what's happening is you have no container holding in your 'navbar' and 'bodybox'.

It's a little hard to explain in a forum post, but I found a nice little tutorial that should help you figure this out.

Two columns with color

Also, just for a quick reference, IE6 does not recognize the 'min-height' attribute. You can use js or a separate style sheet with a regular expression to get IE6 to recognize 'min-height'--but if you use the tutorial above you won't even need it.
 
alright, thanks! i will check it out in a bit and see how it goes. And yes, i did notice IE6 didn't recognize min/max height so i was going to have to change that either way.
 
in the link you gave me it shows rihgt nav version

I understan the #nav and the #content sections there just telling you where those sections are going at least as far as i understand. But i don't understand what container is exactly doing. to me it just looks like it's another content box of some sort but doesn't really do anything. Maybe i am just confused but would you be able to show me another example or something?

EDIT: for example you are putting the nav and the content in a css style called container but how does that make them both expand together? is what i dont understand...
 
The 'container' is being set with a background-color of #fff. Which gives us the white column. Then they use a grey image for the 'nav' and repeat the image down side of the 'container'.

If you look at the actual 'nav' and 'content' elements, there is no background-color. It is simply text being 'laid-over' the 'content' background.

You can do it another way without background-images if you want. It can be found here: 2 Even columns CSS layout

However, this way is more complicated.

If you use the tutorial above and don't want a fluid width, just set the main container to the width you want.
 
hmm i didn't realize you wer using a background... is there a way to do it without a background like is there a way to say repeat the "navbar" section to the bototm with just background color?

Or would i have to use a background image to do that?


EDIT: http://mysite.verizon.net/malikfam/ben1/howmuchmoneyisavailable.html

I know the background image isn't big enough, BUT it seems to work, EXCEPT if you go to frequently asked questions ... would someone be able to tell me why. I mean it's all one content box area right now so margin-right: xyPX; won't work to keep it over on the right side, so when it gets lower how would i keep it out of hte gray?
 
So the problem is... i can get hte background to go all the way down but then the text form thei content goes over to the gray space after the navbar is "done" and i don't want to make every page as big as the faqs page cause then there iwll be MUCH extra space so i wanted it to dynamically grow and shrink with the page so i can't set the height for the navbar as long as the faqs page which would fix the problem cause then the other pages are way to long.

Help would be great :)
 
You must log in or register to reply here.
Back
Top