Bug meniu? Bg-ul apare in plus

Salutare!
Am dat peste încă o problemă în html.
Îmi apare din background în plus pe hover(ca în imaginea atașată).
Codurile:
HTML:

<div id="menu" >
<div><a href="#">Option 1</a></div>
<div><a href="#">Option 2</a></div>
<div><a href="#">Option 3</a></div>
<div><a href="#">Option 4</a></div>

</div>

CSS:

#menu{
opacity: 0.9;
z-index: 0;
position: absolute;
top: 217px;
width: 530px;
left: 50%;
height: 40px;
margin-left: -265px;
-webkit-border-top-left-radius: 10px;
-webkit-border-top-right-radius: 10px;
-moz-border-top-left-radius: 10px;
-moz-border-top-right-radius: 10px;
-o-border-top-left-radius: 10px;
-o-border-top-right-radius: 10px;
background: url(images/bg_menu.png) repeat-x center;
}
#menu div a{
color: lightgray;
font-family: Arial;
letter-spacing: 2px;
text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);
}
#menu div{
margin: 0px;
color: white;
padding: 10px;
background: black;
padding-bottom: 10px;
height: 20px;
padding-left: 25px;
padding-right: 25px;
display:inline-block;
background: url(images/bg_menu.png) repeat-x center;
-webkit-transition: All 0.5s ease;
-moz-transition: All 0.5s ease;
-o-transition: All 0.5s ease;
transition: All 0.5s ease;
}
#menu div:hover{
-webkit-transition: All 0.5s ease;
-moz-transition: All 0.5s ease;
-o-transition: All 0.5s ease;
transition: All 0.5s ease;
background: url(images/bg_menu_hover.png) repeat-x center;
}

EDIT: Am avut o problemă cu upload-ul pe forum, am pus-o extern:
[ https://i.imgur.com/7udCZMz.jpg - Pentru incarcare in pagina (embed) Click aici ]

Edited by MihaixD, 24 January 2013 - 21:06.

In CSS la randul 6 mareste cifra cu inca 40 sau mai multi pixeli (570px sau mai mult) in:
width: 530px; = gresit
In CSS la randul 9 mareste cifra cu inca 10 sau mai multi pixeli (-275px sau mai mult) in:
margin-left: -265px; <= asa este in codul tau

Meniul se va muta mai spre stanga din mai multe incercari vei reusi.

Edited by poadol, 24 January 2013 - 22:19.

poadol, on 24 ianuarie 2013 - 22:03, said:

Aşa apare şi în partea dreaptă...
Am modificat padding-ul şi mi-a mers.
Mulţumesc oricum.

Edited by MihaixD, 24 January 2013 - 23:01.

De curiozitate care padding ai modificat si ti-a mers? Ce browser folosesti?

Edited by poadol, 24 January 2013 - 23:20.

poadol, on 24 ianuarie 2013 - 23:15, said:

Din menu div am modificat padding-left şi padding-right.
Mozilla Firefox folosesc.
Scuze, nu văzusem mesajul.

Edited by MihaixD, 30 January 2013 - 18:43.

Atunci am inteles eu gresit: "Îmi apare din background în plus pe hover(ca în imaginea ataşată).", eu cosiderand ca te deranjeaza background-ul negru, nicidecum dunga verticala albastra de culoare mai inchisa.
(padding = este spatiul dintre marginea elementului si continutul elementului;) Bine ca ai rezolvat.