Strange Opera/CSS problem

[#1]

Last year, I revamped my websites to make use of CSS. I got the CSS to work OK in SeaMonkey and IE (with a separate style sheet), and it also works in Firefox.
I've only now come to view it in Opera, and the positioning seems to be all to rooster.
This is how it should look (and does look in FF, IE6 and SeaMonkey):
http://www.judgemental.plus.com/FF.jpg
This is how it looks in the latest version of Opera:
http://www.judgemental.plus.com/Op.jpg
In Opera, the navigation sidebar is shoved all the way to the top, and the item date entries and images in the main div are shifted to the right. Also, the scrollbar in the main div doesn't go all the way to the right side of the viewport (although it's possible that these last three problems are a consequence of the sidebar one).
The stylesheet controlling this page is here:
http://www.thejudge.me.uk/style_main.css
Can anyone put their finger on what the problem is with Opera here?
TIA

[#2]

Yeah,
Fixe the sizes of the header in its height and side for height and width.
if any of that doesn't affect it, it maybe that because Opera handels DIV's differently on a different layer that it's starting from the top again.
Meaning, set the DIV ID'd "menubar"'s Top, to a set value so it always falls in the correct place (Header Size + 10px or so).

<DIV ID = "navbar" STYLE = "position: absolute; top: XXXpx">

It seems Opera is treating the Navigation Bar on the Left like a Frame :S
Not sure why this is happening to be honest,
I had a battle with my site, it also uses alot of DIV's and Opera handels it more how I expect my pages to be seen, compared to say
IE: that seemed to treat it about the same but alignment was alittle different.
Hope you find what's wrong and how to fix it!
Jim,

[#3]

Quoth PJ:

Quote

Have you thought about using fixed pixel widths and heights for #heading and #navbar - I have a monitor set to a high resolution and all your links are grouped on four lines, rather than neatly down the page.

Yur, but the point of having %age dimensions is so that #navbar varies according to screen resolution. You see it as four lines, I see it as two columns of five with one on top, and smaller resolutions see it as a single column with a scrollbar. This prevents horizontal scrollbars in the #main div at smaller resolutions.
PJ adds:

Quote

Also worth pointing about that #navbar is 15% width AND has a 1px border, whereas #main is set as margin-left: 15%

Ah, well spotted. I've adjusted that now.
And PJ goes further:

Quote

Not sure that you need the float attribute either when you're setting absolute values, and it's possible that's what's confusing Opera.

Dat's der furry creature with floppy ears! Opera now shows #navbar in the right position!
Now I've just got to figure out why the <h2> (item dates) and images are shifted to the right in Opera...
Many thanks.