Matthias: Ränder links und rechts durchgängig

Beitrag lesen

Hallo zusammen,

ich hab ein Problem bei dem ich nicht mehr weiter weiss. Ich möchte einen <div> zentriert auf einer Seite haben (in den später weiterer Inhalt kommt). Dieser div soll links und rechts eine Grafik als Rand haben. Dieser Rand soll mindestens 100% Höhe haben, wenn die Seite größer wird um man scrollen muss, soll der Rand auch durchgängig sein. Nur krieg ich das nicht hin. Firefox zeigt mir mit unten stehenden Code das Ergebnis richtig an, Opera läßt allerdings ein kurzes Stück am Ende weg, der IE macht nur zwei kurze Stücke des Randes. Kann mir da jemand helfen? Das Problem kann man hier sehen: http://abraxaz.gmxhome.de/cssproblem/

und hier noch kurz der Code:

CSS:
_____________________________________________________
.main {
    position:absolute;
    left:50%;
    min-height:100%;
    padding:0px;
}

.navi {
    position:absolute;
    width:14px;
    top:0px;
    left:50%;
    height:100%;
    min-height:100%;
    bottom:0px;
}

html:
____________________________________________________

<body topmargin="0" bgcolor="#3A4049">

<div class="main" style="background-color:white; width:746px; margin-left:-370px; text-align:center;">

<!-- Platz verbrauchen -->
oben<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /> <br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />unten
<!-- /Platz verbrauchen -->

<div class="navi" style="background:url(side_r.jpg) 0% 0% repeat-y; margin-left:364px; ">&nbsp;</div>
<div class="navi" style="background:url(side_l.jpg) 0% 0% repeat-y; margin-left:-384px;">&nbsp;</div>
</div>
</body>

Bin für jeden Tip dankbar.

Gruß, Matthias