ie8 iframe height problem

[BlitzkriegBop]

I have a website I developed in IE6 and it looks great. But when I run the same site using IE8 the iFrame height is really short instead of filling the page to the bottom.
Another problem is that the 2 div sections are now aligned one on top of the other instead of navColumn being on the left of the page and contentColumn aligned to the right of it.
The only way I can get it to work is by adding <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7"> to the head section of the page containing the iFrame.

Is there another way I should be doing this because I would rather not to that.

Here is how it looks:

CSS:
.navColumn
{
float: left;
padding-right: 8px; /* width:24%; */
border-right: Solid 1px #397371;
height: 100%;
background-color: #5A9A98;
overflow-y: auto;
overflow-x: hidden;
}
#contentColumn
{
width:auto;
background-color: #ffffff;
height:100%;
}


aspx page:
<div id="divnavColumn" class="navColumn" runat="server">
.....
</div>

<div id="contentColumn">
<asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">
<iframe id="ContentIFrame" frameborder="0" height="100%" width="100%" src="Home.aspx?pageID=Home"></iframe>
</asp:ContentPlaceHolder>
</div>

Thanks