IE7 CSS Floating Issues

I'm having issues with a site I'm designing in IE7, particularly with medium to lower sized resolutions. There's a nav element floated to the left in a div, #content_inside. #page, holding actual content, then fits around the floated nav. Now, with particular resolutions, the #page content drops down below nav, which doesn't make sense since #page is not a floated element at all. I've included a link below for reference.

The other issue is the way IE7 is rendering images, those most affected being at the bottom of the page. The edges seem choppy and low-quality. Is this a known issue? It doesn't appear in any other browser on any other platform.

I beli开发者_开发问答eve the floating issue may occur in other IE versions, as well.

I didn't notice any of this until I viewed the website at the client's workplace, where they're running IE7 on Windows XP. I've tried plenty of fixes and the problems persist, so any help is appreciated.

Address: http://alexjewell.com/clients/klineman/

Thanks a lot.

PS - If it helps, the site is done in HTML5.

---

I have to be honest, this seems simple enough for you not to be running into issues like this.

With respect to HTML5, I recommend you read this article for dealing with IE7.

It seems that you have not given this page a width. Is that on purpose?

I wrote a standard simple way of creating a 2 column layout that I think can help you out.

Hope this all made sense.

---

Would it be easier to use another div tag instead of the nav tag? IE may not recognize this because it's HTML5.

---

Change your #page

#page{
    padding: 185px 10% 32px 350px;
}

to

#page
{
    margin-top: 185px;
    margin-left: 350px;
}

Its better to use margin for these sorts of things.