height:100% not working in Internet Explorer

Question

I have a question about the CSS property height:100% in Internet Explorer.

height:100% does not work in IE, but it does in Firefox and Chro

Answer 1

In order to use height: 100%, the parent container should have a fixed height.

So for example while this should work:

    

        Left Column
    
    

        Right Column
    

The following will not work:

    --- same code

One way to achieve a fixed height when you don't know parent's height is using position: absolute;.

    

        Left Column
    
    

        Right Column
    

Otherwise you could use javascript as noted in the other answer. But I prefer pure CSS solutions.

Check here for a live fiddle.

Hope that helps.