Question

I am having a little trouble trying to put a border around both rows. It currently only does the first row.

I have used clear:both; for a new row of divs but its seems to take away the parent divs style with the border.

<style type="text/css">
.box {
    border: 1px solid #E5E5E5;
    border-radius: 4px 4px 4px 4px;
    width: 90%;
}
</style>

<div class="box">
    <div style="float:left; width:150px;">
        Row 1, Column 1
    </div>
    <div style="float:left; width:150px;">
        Row 1, Column 2
    </div>

    <div style="clear:both;"></div>

    <div style="float:left; width:150px;">
        Row 2, Column 1
    </div>
    <div style="float:left; width:150px;">
        Row 2, Column 2
    </div>
</div>

Thanks

Answer 1

If you want to keep the same HTML structure, simply add a clear:both container after your last div. http://jsfiddle.net/7cptj/