Untitled

<div id="content">
        <div id="leftDiv" style="background:green;"> </div>
        <div id="rightDiv">
            <p>Sample content</p>
            <p>Sample content</p>
            <p>Sample content</p>
            <p>Sample content</p>
        </div>
    </div>

<html>
    <head>
        <meta charset=utf-8 />
        <title>JS Bin</title>
        <!--[if IE]>
          <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
        <![endif]-->
        <style>
            .floatLeft {float:left;}
            .child-left, .child-right {width:50%}
            .child-left {background:yellow;}
            .child-right {
                background: none repeat scroll 0 0 green;
                float: right;
                height: 100%;
                position: absolute;
                right: 0;}
            .parent {
                overflow: hidden;
                position: relative;
                width: 100%;
            }

        </style>
    </head>
    <body>
        <div class="parent">
            <div class="child-left floatLeft">content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content content
            </div>

            <div class="child-right floatLeft">content content content content content content content content content content content content content content content content
            </div>
        </div>
    </body>
</html>

<html>
<head>
<style type="text/css">
#content {
    display: table;
    width: 100%;
    min-height: 100%; /* remove this line if not necessary */
}
#leftDiv, #rightDiv {
    display: table-cell;
    min-height:100%;
}
#leftDiv {
    width:100px;
    background:green;
}
#rightDiv {
    background:cyan;
}
</style>
</head>
<body>
    <div id="content">
        <div id="leftDiv"> </div>
        <div id="rightDiv">
            <p>Sample content</p>
            <p>Sample content</p>
            <p>Sample content</p>
            <p>Sample content</p>
        </div>
    </div>
</body>
</html>