Schildi: Relative Layer-Positionierung

Hallo,

Habe Probleme mit der relative Layer-Positionierung (für menue).
Der Grundaufbau ist so:

<style type="text/css">
#L1 { position:relative; visibility:visible; top:50px; left:200px; width:0px; height:0px; z-index:1; }
#L1a { position:absolute; visibility:visible; top:0px; left:0px; width:0px; height:0px; z-index:1; }
#L1b { position:absolute; visibility:visible; top:30px; left:0px; width:0px; height:0px; z-index:1; }
#L2 { position:relative; visibility:visible; top:50px; left:300px; width:0px; height:0px; z-index:2; }
#L2a { position:absolute; visibility:visible; top:0px; left:0px; width:0px; height:0px; z-index:1; }
#L2b { position:absolute; visibility:visible; top:30px; left:0px; width:0px; height:0px; z-index:1; }
</style>

<div id="L1"> <!--soll relativ ausgerichtet sein-->
   <div id="L1a"></div> <!--soll absolut zu '1' ausgerichtet sein-->
   <div id="L1b"></div> <!--soll absolut zu '1' ausgerichtet sein-->
</div>

<div id="L2"> <!--soll relativ ausgerichtet sein-->
   <div id="L2a"></div> <!--soll absolut zu '2' ausgerichtet sein-->
   <div id="L2b"></div> <!--soll absolut zu '2' ausgerichtet sein-->
</div>

Jetzt habe ich immer das Problem, das unter den Layern liegende Bereiche (Tabellen etc. im body) mitverschoben werden um die werte der Hauptlayer (L1 bzw. L2).

Dies passiert bei absoluter Positionierung nicht.
Ich brauche aber eine relative.

Was mache ich falsch???

  1. Hi Schildi,

    Jetzt habe ich immer das Problem, das unter den Layern liegende Bereiche (Tabellen etc. im body) mitverschoben werden um die werte der Hauptlayer (L1 bzw. L2).

    Richtig, denn relative Positionierung verschiebt lediglich Elemente und wirkt somit auch auf alle nachfolgenden.

    Dies passiert bei absoluter Positionierung nicht.

    Weil du damit Elemente aus dem Elementenfluss nimmst, nachfolgende berücksichtigen sie nicht mehr.

    Ich brauche aber eine relative.

    Du könntest das gesamte Konstrukt in ein weiteres DIV setzen und dieses eventuell absolut positionieren.

    <div>

    <div id="L1"> <!--soll relativ ausgerichtet sein--> </div>
    <div id="L2"> <!--soll relativ ausgerichtet sein--> </div>

    </div>

    LG Roland