2 divs aligned side by side, how to make right div fill width 100%?

Question

I\'m wondering what the best way to go about doing this is...

I have 3 divs:

• a div#container with width=100%; tha

Answer 1

Have a look at "liquid layouts" it can describe what you're talking about.

You're probably looking for this one.

In your example, try setting your display to inline. However, you won't technically be able to use block level elements in it, so have a look at the links I posted above. :)

The problem with setting the width to 100% if you're using floats is that it is considered 100% of the container, so it won't work either since the 100% includes the left div's width.

Edit: Here is the example of the other answer, I've edited it to include the html/css from the example site above for simplicity's sake.

I'll also include it below:

HTML

    

        
Content Column: Fluid
    


    
Left Column: 200px

CSS

#contentwrapper{
float: left;
width: 100%;
}

#contentcolumn{
margin-left: 200px; /*Set left margin to LeftColumnWidth*/
}

#leftcolumn{
float: left;
width: 200px; /*Width of left column*/
margin-left: -100%;
background: #C8FC98;
}