Tobias: relative Positionierung zu einen bestimmten Element

Hallo!
Ich habe ein element (tabelle oder ähnliches) ne id verpasst und damit auch gleich positioniert. Gibt es jetzt eine Möglichkeit ein weiteres Element relative zu diesem element zu positionieren??
Wenn ja, wie sieht das aus???

Danke und Tschau

Tobias

  1. Hallo Tobias,

    dazu müsstest Du erstmal klarstellen, was Du unter "realtiv zu dem Element positionieren" meinst.

    Ich rate mal.

    Du hast einen Rahmen, und willst einen zweiten Rahmen in einem Abstand von deisem ersten psotionieren, der sich aus der Postion des ersten egibt. Das nennst Du relativ positionieren.

    CSS versteht darunter leider etwas anderes. Nach CSS Nomenklatur müsstest Du den Rahmen "absolut" postionieren. Auf welche beiden Kanten des ersten der zweite jetzt seine Position bezieht, liegt daran, ob du (top oder bottom ) und (left oder right) angibst. Wenn Du z.B. schreibst:

    div 1 position absolute
    div 2

    position:absolute; bottom:10px; right:40px;

    /div 2
    /div 1

    Dann wird der Bereich 2 mit seiner Unterkante 10px Abstand zur Unterkante des Bereich 1 halten und mit seiner rechten Kante 40px Abstand zur rechten Kante des Rahmen 1 (nach innen)

    Wenn Du aber schreibst:

    div 1 position absolute

    /div 1

    div 2

    position:absolute; bottom:10px; right:40px;

    /div 2

    Dann wird sich dein Bereich 2 irgendwie in z-Richtung über den Rahmen 1 legen, wenn Du Glück hast, mit einem Abstand von 10px vom Ende des bodys (wenn es sonste keine weiteren Elemente gibt.

    Die Angabe relative besagt, dass sich die Maße auf die ursprünglich zugewiesene Größe und Postion des übergeordneten Bereiches beziehen. Wenn der durch innenliegende Elemten (Bilder, Texte) aber gestreckt wurde, stimmt die neue untere Kante z.B. nicht mehr mit der ursprünglichen überein.

    Du musst damit einfach eine Menge eumspeilen, um es einigermaßen zu durchschauen und so ca. dreißig bis hundertdreißig mal Scheiße brüllen. dann wirds schon klappen.

    Liebe Grüße aus http://www.braunschweig.de

    Tom

    --
    Intelligenz ist die Fähigkeit, aus Fehlern Anderer zu lernen und Mut die, eigene zu machen.
  2. Hallo!
    Ich habe ein element (tabelle oder ähnliches) ne id verpasst und damit auch gleich positioniert. Gibt es jetzt eine Möglichkeit ein weiteres Element relative zu diesem element zu positionieren??
    Wenn ja, wie sieht das aus???

    Danke und Tschau

    Tobias

    Hi Tobias,

    würde ich so machen:

    function relativePositioning(relattivatorID,elementID,abstandTop,abstandLeft)
    {
      // relativator ist das element, zu dem relativ positioniert werden soll (die tabelle)
      relativator = document.getElementById(relativatorID);
      var rTop = relativator.style.top;
      var rLeft = relativator.style.left;
      // element ist das relativ von relativator zu positionierende element
      var element = document.getElementById(elementID);
      // position berechnen
      var eTop = rTop + abstandTop;
      var eLeft = rLeft + abstandLeft;
      // positionieren
      element.style.top = eTop;
      element.style.left = eLeft;
    }

    Ist nicht getestet, sollte aber klappen - geht ja aber auch nur im die idee dahinter...
    Falls element noch nicht existiert, muss du es vorher mit createElement() erzeugen - sihe DOM->document bei selfhtml.

    Gruss,
    Attila

  3. Ich habe ein element (tabelle oder ähnliches) ne id verpasst und damit auch gleich positioniert. Gibt es jetzt eine Möglichkeit ein weiteres Element relative zu diesem element zu positionieren??

    Nein, zumindest nicht direkt. Du könntest aber wie folgt an dein Problem rangehen:

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
      <title>Positionierung</title>
      <style type="text/css">
      #eins {
         position: absolute;
         left: 100px;
         right: 100px;
         background-color: yellow;
      }
      #zwei {
         margin: 0;
         padding: 1em;
         background-color: green;
      }
      #drei {
         background-color: blue;
         padding: 1em;
         margin-top: 50px; /* statt Positionierung */
         margin-left: 50px;
      }
      </style>

    <div id="eins">
        <div id="zwei">Test</div>
        <div id="drei">Test</div>
      </div>

    Vielleicht hilft dir das weiter.

    MI, der sich durchaus bewusst ist, dass das kein gutes HTML ist

    --
    : Michael Jendryschik : michael@jendryschik.de : http://jendryschik.de/ :
    : Einführung in XHTML, CSS und Webdesign   http://jendryschik.de/wsdev/ :
    : Monatlich das Beste aus de.alt.netdigest http://best-of-netdigest.de/ :