Problem with displaying a menu in Opera browser

They have: 2 posts

Joined: Nov 2012

I'm new to this forum so firstly I want to say hi to everyone.

I'm learning html and css for about a month so I'm still quite a beginner. I've been working on this page for some time and I still can't solve the problem of badly displayed menu in Opera.

Here's how it looks in Chrome and Firefox (don't worry it's just a polish version of ImageShack). As you can see the menu buttons are contained within the brown nav bar as they should be:

And here's the problem I have to solve, displayed in Opera:
In this case menu buttons are thrown out from the nav bar.

Here is a html code for a menu and nav bar:
div id="navi">
a href="index.html" id="logo">
div id="menu">
a href="forum.html" class="forum">
a href="quizy.html" class="quizy">
a href="vs.html" class="vs">
a href="postac.html" class="postac">
a href="rankingi.html" class="rankingi">
a href="index.html" class="in-index">

A css code for a menu and nav:

body { width: 100%; margin: auto; font-family: arial; color: #352315; background-color: #eceae1; }
nav { width: 100%; height: 75px; background-color: #352315; }
#navi { width: 950px; margin: auto; }
#logo {position: relative; top: 16px; }
#menu {float: right; }
#menu a {display: block; float: right;}

and the example of button code here:

.in-index { display:block; width:123px; height:75px; background: url(menu/index-mouse.png); background-repeat: no-repeat; float: right; }
.index { display:block; width:123px; height:75px; background: url(menu/index.png); background-repeat: no-repeat; float: right;
-webkit-transition: background 0.7s ease; }
.index:hover { background: url(menu/index-mouse.png); background-repeat: no-repeat; float: right; }

Thank you for your answers!

They have: 2 posts

Joined: Nov 2012

I've just solved the problem... I've just written float: left; in #logo...

They have: 25 posts

Joined: Jun 2012

Great, good post..

Want to join the discussion? Create an account or log in if you already have one. Joining is fast, free and painless! We’ll even whisk you back here when you’ve finished.