CSS Columns: Fixed width and "remainder"?

Question

Let's say I want to have two columns. The right one is 200px wide, and the left one just takes up the remaining width. Is this possible? What do I set the width of the left column to be?

Rather than fighting with this for hours, I'll get your opinions first ;)

Answer 1

Yes, it is possible. Set the right column's style to float: right and width: 200px, and the left column will be the content and take up the rest of the width.

Answer 2

You float the left column and set margin to minimum of the width of the left column.

<div id="Container">
    <div id="LeftColumn" style="float: left; margin-right: 200px;"></div>
    <div id="RightColumn" style="float: right; width: 200px;"></div>
</div>

OR

<div id="Container">
    <div id="RightColumn" style="float: right; width: 200px;"></div>
    <div id="LeftColumn" style="margin-right: 200px;"></div>
</div>

Answer 3

If you don't want to float divs, you can do the following:

.rightDiv {
  position: absolute;
  right: 0;
  width: 200px;
}

.mainDiv {
  position: absolute;
  left: 0;
  right: 200px;
}