menu HTML+CSS

Ahoj,
mám udělat jedno menu, ale už opravdu netuším jak.
Zkoušel jsem vše, co jsem uměl, ale nic nepomohlo.

V zadání je menu, v kterém každá položka bude mít zaoblený strany.

Takže jsem si udělal obrázky levéh a pravého zaoblení a poté si to zkusil sestavit.
Po chvíli ozkoušení jsem dostal menu tak jak by mělo vypadat, dokonce se i zobrazovalo ve všech prohlížečích stejně,
avšak při zoomování stránky se menu rozpadá v MF a Opeře. Zkoušel jsem to spoustukrát předělat, ale nic nezabírá.

Kdyžtak přikládám i kód menu, CSS a link na stránku o kterou se jedná.
(kdybyste tam našli nějakou kravinu, tak se omlouvám - ze zoufalství jsem už zkoušel vše co mě napadlo)


HTML kód:



<div class="menu">

<div class="menu-vnitrek">

<span class="polozka-celek">



<img src="resources/images/polozka-l.gif" alt="l" class="polozka-l" />
<span class="polozka-menu-pozicovani">
<span class="polozka-text">


Položkac


</span>
</span>

<img src="resources/images/polozka-p.gif" alt="p" class="polozka-r" />


</span>


</div>


</div>



CSS:

.menu {
background-image: url('../images/menu.gif');
background-repeat: no-repeat;
height: 41px;
width: 871px;
padding-top:3px;
}

.menu-vnitrek {
height: 34px;
}

.polozka-l {
padding: 0px;
margin: 0px;
position: relative;
left: 5px;
}

.polozka-r {
padding: 0px;
margin: 0px;
}

.polozka-celek {
position: relative;
left: 50px;
padding: 0px;
}

.polozka-text {
background-image: url('../images/polozka-bg.gif');
background-repeat: repeat-x;
color: white;

font-size: 20px;
font-weight: bold;
Line-height: 30px;
}

.polozka-menu-pozicovani {
position: relative;
bottom: 7px;
}


Jde mi o tuhle stránku:
http://sab.jonaskopp.cz



Poradí někdo? Byl bych moc vděčný...