ellenbo
6/10/2014 - 9:50 PM

2 column div layout: right column with fixed width, left fluid

2 column div layout: right column with fixed width, left fluid

<div class="container">
    <div class="right">
        right content fixed width
    </div>
    <div class="left">
        left content flexible width
    </div>
</div>
Description:
How to create a two column div layout where one column is a fixed width and the other is responsive.

Source:
Stackoverflow
http://stackoverflow.com/questions/5195836/2-column-div-layout-right-column-with-fixed-width-left-fluid
.container {
   height: auto;
   overflow: hidden;
}

.right {
    width: 180px;
    float: right;
    background: #aafed6;
}

.left {
    float: none; /* not needed, just for clarification */
    background: #e8f6fe;
    /* the next props are meant to keep this block independent from the other floated one */
    width: auto;
    overflow: hidden;
}