Two Column Flexible

Ver 2.0

This is a very easy page layout which you have probably seen on sites such as ALA (A List Apart). Each column is created with simply two div tags.

The left column uses float left and has a percentage width allowing both columns to 'flow' as the browser window changes shape.

Drawback? Resize your browser and see!


Here is the CSS for the divs.


#lh-col{
        width: 60%;
        float: left;
        border: solid #333333;
        border-width: 0 2px 0 0;
        background: #ffffff;
        color: #333333;
        margin: 0;
        padding: 40px;
        }


#rh-col{
        background: #c0c0c0;
        color: #333333;
        margin: 0;
        padding: 0;
        }



The right column can be used for
navigation links, search box etc.



VIEW MORE TEMPLATES.