How to make 100% height columns with skeleton?

Question

I would like to have 2 columns that are 100% height, without using <table> and using the responsive columns from skeleton css.

html, body {
    height: 100%;
}
.container {
    min-height: 100%;
}
.column, .columns {
    min-height: 100%;
}

<div class="container">
    <div class="ten columns alpha">
               bla bla bla
    </div>
    <div class="six columns omega">
        bla bla bla
    </div>
</div>

The container looks like it's 100% height but not the columns. Is there a way to achieve this ?

Rebarebah

If you want the columns to have the same height as the container, and you know those columns will always be within that container, then you should use height:inherit. Be mindful that this is not available in Internet Explorer 7, but since you're using min-height and not any fallbacks, it looks like you don't care anyway. – Annitaanniversary

OP have you solved this? – Iulus

Answer 1

Try this CSS:

.container {
    min-height: 100%;
    float: left;
    width: 100%;
}

Indiana