CSS Columns: Fixed width and fluid “remainder”

I encountered a little issue with a simple 2 column layout for a small project I am working on. The left column was to be fixed at 220px and the right needed to be what was left of the screen width.

After several attempts, it ended up being quite easy.

<style>
    .main .left-col{width: 220px;float:right}
    .main .main-content{overflow: hidden}
</style>
<div class="main">
    <div class=".left-col">
        <!-- Content -->
    </div>
    <div class=".main-content">
        <!-- Content -->
    </div>
</div>

Share
You can leave a response, or trackback from your own site.

One Response to “CSS Columns: Fixed width and fluid “remainder””

  1. Jonell says:

    Precisely what I was looking for, thanks for putting up.

Leave a Reply

Comments links could be nofollow free.

Twitter Delicious Facebook Digg Stumbleupon Favorites More