2-column layout in Opera not aligning correctly

Possible float issue?

[gldweb]

I am starting to get more into creating layouts using CSS and I have run into an issue trying to create a 2-column layout. It is a basic layout with a vertical nav menu on the left and the main content on the right.

I am using the following CSS:

#navcontainer {
float: left;
width: 200px;
margin: 0 0 0 10px;
padding: 0;
}
#maincontent {
margin: 0 2em 0 220px;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
}

It renders fine in IE6, Firefox, Mozilla, & Netscape 7.1. In Opera 7.51 the top alignment of the two columns do not match. The #maincontent displays lower than the #navcontainer.

Any thoughts?

Thanks

[gldweb]

I attempted adding 20px top padding to the navcontainer, which moved the navcontainer in alignment with the maincontent in Opera, but in all other browsers navcontainer is no longer in top alignment with maincontent.

Any ideas on how this can possibly be hacked to look right in all browsers, would be much apprecitated.

Thanks

[Gorilla]

You should check what it looks like in the latest Opera version. Opera 8 was released a few days ago. You can get the latest version of the browser here: [opera.com...]

I would not have bothered to get it working 100% in Opera 7.51. That version will soon be only of historic interest.

[gldweb]

I downloaded ver 8 and the float issue is no longer an issue.

Thanks