Page layout breaks only in Opera which is weird?

Question

Okay so I'm working on an admin panel, in which everything should always be only within the view port until you hit the minimum widths and heights set.

The current version of it can be seen here (its still in development) : http://qwibbledesigns.co.uk/preview/Admin/

In layout terms, it works flawlessly in all browsers, even down to ie6 =D. However, opera doesn't like it, and for some reason, always add's extra space to the bottom of the page, making it have an extra scrollbar, and I can't fathom it out which is highly annoying.

Jquery is used to set the height of the container, sidebar, and content area so that they're always within the browser view port, and these functions rerun when the window is resized. I therefore cannot work out the the life of me what's wrong with opera.

Would anyone mind taking a look and seeing if they can work it out? =D

Answer 1

Have you tried body{overflow:hidden}?

Answer 2

I see a sidebar for <div id="content"/>. could be that the element inline style you set height:424px; Try removing it and see if it works.

Answer 3

This is more of a design question than a programming question, but I did the following, and it seemed to help.

Removed height:100%; from the html, body selector, and added a few things:

html, body {
    margin:0;
    padding:0;
    clip:auto;
    overflow:hidden;
}

Seemed to help.

docType is a good site for design questions.

http://doctype.com