Question

I have a container: divA.

divB and divC are inside divA.

Both divB and divC are floated left, so they are side by side.

#divA
height:500px;
width:1000px;

#divB 
width:200px;
height:100%;
float:left;

#divC
height:100%;
float:left;
width:????

I want divC to fill the remaining space of divA dynamically, i.e I need it to have a dynamic width. How can I do this?

P.S If I set its width to 100% it fills the entire divA. What I want is for it to fill the entire width of divA but minus divB.

Answer 1

Give overflow:hidden to your #divc .Write like this:

#divB{ 
width:200px;
height:100%;
float:left;
}
#divC{
height:100%;
overflow:hidden;
}

Check this http://jsfiddle.net/yY388/