div Container richtet sich nicht absolut am Eltern-Element aus

[moserartz]

Hallo zusammen

Ich bin kurz vorm verzweifeln. Google kennt mein Problem nicht und auch im Forum hab ich nichts passendes gefunden.

auf einer neuen Seite (Sie ist online auf Prime Security ) möchte ich unter dem Platzhalter fürs Logo einen Balken quer in der Mitte platzieren. Das hat wie ihr seht geklappt. Zusätzlich soll links und rechts von diesem Balken ein Verlauf von diesem Balken zu Transparent platziert werden.

Somit habe ich einen div-container erstellt und darin drei weitere. Einen fürs Menu selbst, einen für links und einen für rechts

<div id="menu">    <!--Linkmenu mitte -->    <div id="menu-middle">&nbsp;</div>    <!--Linkmenu aussen links-->    <div id="menu-left">&nbsp;</div>    <!--Linkmenu aussen rechts-->    <div id="menu-right">&nbsp;</div></div>

und im stylesheet entsprechend die Formatierung vorgenommen.

#menu {    width:1600px;
    height:50px;
    margin:0 auto 0 auto;
    }
#menu-middle {
    width:800px;
    height:50px;
    background-image:url(../img/menu_middle.png);
    background-repeat:repeat-x;
    margin:0 auto 0 auto;
    }
    
#menu-left {
    width:400px;
    height:50px;
    background-image:url(../img/menu_left.png);
    background-repeat:no-repeat;
    position:absolute;
    top:0px;
    left:0px;
    
    }
#menu-right {
    width:400px;
    height:50px;
    background-image:url(../img/menu_right.png);
    background-repeat:no-repeat;
    position:absolute;
    top:0px;
    left:1200px;
    
    }

Aus für mich unerklärlichen Gründen richten sich die Elemente jedoch am body statt am Eltern-Element aus.

Kann mir jemand weiterhelfen?

lg simon

 

[threadi]

Das Layout was Du erreichen willst, kann man imho auch ohne absolute Positionierung erreichen. Schau dir einfach mal die CSS-Eigenschaft float an.

Außerdem ist deine Seite viel zu breit. In meinem Browser habe ich einen horizontalen Scrollbalken, so dass ich nur gut 2/3 deiner Seite überhaupt auf einen Blick sehen kann. Das solltest Du dringend nochmal überdenken.

 

[moserartz]

danke für die schnelle antwort!

hab das jetzt mal so gemacht. --> aber es wäre auch möglich mit position oder?

jetzt ist es aber so, dass bei kleineren bildschirmen, sprich dann wenn der linke teil am rant ankommt, dass sich alle 3 elemente nach rechts verschieben. aber der mittlere balken sollte eigentlich immer an seinem platz in der mitte bleiben. kannst Du mir da vlt. auch weiterhelfen?

 

[Binganzokay]

Position absolute braucht im elternelement ein position relative, sonst richtet es sich automatisch am html-tag aus

 

[moserartz]

nun wenn das nicht peinlich ist...

Hab es jetzt aber komplett anderst gelöst. Denn so wie's jetzt ist, sollte es auch bei einem Kleinen Viewport keine Balken zum schieben geben oder?

nochmal danke!!

simon