How do I use CSS to grow my left div 100% so it fills the space

My left div (with the navigation buttons on it) needs to grow to fill the available space...

Who is Participating?
biXenConnect With a Mentor Commented:
Ah, I see now, the left and right content is totally separate, so the left won't grow to go along with the right content.

My solution, unless it makes other problems for you. Make a container around both of them that has the background image  in it with the entire width + shadows, instead of having it in the left and right content. I usually do that on my sites.
Put this code in your CSS. Then give the leftColumn the class named clearfix. Maybe you have to assign that class to the wrapper too, not sure how you've coded the site. But I'm assuming the bg image with the left shade and such is a background that repeats in the leftColumn div, so it should work. If not lemme know.
/* Clearfix style - START - Forces Firefox to expand divs when content is bigger than initial height. Must be applied as a class to the divs needing it */
	content: ".";
	display: block;
	height: 0;
	clear: both;
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* Clearfix style - END */

Open in new window

nickrjsmithAuthor Commented:
not working... is it because there are already styles on the div

this is the style

they are all here

#leftcolumn {
 border: 1px solid #ccc;
 width: 219px;
 float: left;
 background-image: url(../img/navBarBack.gif);
 background-repeat: repeat-y;
nickrjsmithAuthor Commented:
great idea.. thanks
All Courses

From novice to tech pro — start learning today.