Detlef G.: Layer unabhängig voneinander positionieren

Beitrag lesen

Hallo Willi

Hast du dem Parentlayer position:relative;

nein, position:absolute, aber ich hatte alles mögliche durchprobiert

Und warum nicht position:relative;?

  • immer der selbe effekt. setze ich die sublayer auf top:0px, fangen sie immer am oberen Bildschirmrand, nicht am Parentlayerrand an.

Solange sie kein Vorfahrenelement haben, bei dem eine von static abweichende Angabe für position angegeben ist, beziehen sich die Angaben für top, right, bottom und left auf den Viewport (das Browserfenster).

Wenn du deinem Parentlayer position:relative; gibst, dann wird er genau dort und genauso dargestellt, als wenn er keine Angabe zu position hätte. Aber seine absolut positionierten Nachfahreneelemente beziehen ihre Position auf seinen Rand.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">  
<html>  
  <head>  
    <title>Positon</title>  
    <style type="text/css">  
[code lang=css]#Parentlayer {  
  position:relative;  
  height:300px;  
  width:75%;  
  margin:0 auto;  
  background-color:red;  
}  
#Parentlayer div {  
  position:absolute;  
  background-color:green;  
  width:10em;  
  height:2em;  
}  
#L1 {  
  top:0;  
  right:0;  
}  
#L2 {  
  bottom:0;  
  left:50px;  
}  
#L3 {  
  top:150px;  
  right:150px;  
}  

</style>
  </head>
  <body>
    <h1>Position relativ und absolut im Relativen</h1>
    <div id="Parentlayer">
      <div id="L1">das ist L1</div>
      <div id="L2">das ist L2</div>
      <div id="L3">das ist L3</div>
    </div>
  </body>
</html>

[/code]
Auf Wiederlesen
Detlef

--
- Wissen ist gut
- Können ist besser
- aber das Beste und Interessanteste ist der Weg dahin!