Overflowing a container div horizontally but not vertically

Question

I\'m working on a website that uses two columns inside a container. The container has a white background that should stretch to the bottom of whichever column is highest, so

Answer 1

Solution is to use inline-block elements..

Css

.container{
    width:300px;
    background-color:#ccc;
    margin:0 auto;
    border:1px solid red;
}
.container > div{
    width:150px;
    display:inline-block;
    vertical-align:top;
}
.inner{
    background-color:#666;
    margin-top:10px;
    width:130px;
}
.left .inner{
    margin-left:-10px;
}
.right .inner{
    margin-right:-10px;
    margin-left:auto;
}

HTML

    

        
left 1st inner panel
        
left 2nd inner panel
    

        
right 1st inner panel
        
right 2nd inner panel with arbitrary text to show the increase in parent elements
    

view demo