height: 100% for inside with display: table-cell

Question

Here is 2 column markup using display: table and display: table-cell CSS declarations:

Answer 1

This is exactly what you want:

HTML

    

        
Text
        
Text
        
Text
        
Text
        
Text
        
Text
        
Text
        
Text
    
    

        
Text
    

CSS

.table {
    display: table;
    height:auto;
}

.cell {
    border: 2px solid black; 
    display:table-cell;
    vertical-align:top;
}

.container {
    height: 100%;
    overflow:auto;
    border: 2px solid green;
    -moz-box-sizing: border-box;
}