ich habe Fragen zur Positionierung mit CSS.
Also...erstmal zum Begriffe klären.
1) Wenn man bei position keine Eigenschaft angibt, dann ist das wie die Angabe "static".
Wenn man bei position: static; wählt, dann wird eine Box statisch positioniert, bleibt
im Seitenfluss der Seite.
2) Mit position: relative; wird eine Box relativ zu ihrer statischen Position verschoben.
Boxen können sich überlappen.
3) Mit position: absolute; wird eine Box relativ zu ihrem umschließenden Block verschoben.
4) Position:fixed lasse ich jetzt mal aus.
5) Floats lasse ich jetzt auch aus.
Soweit alles verstanden...nun aber die Fragen. Ich finde in vielen Büchern sind manche
Grundbegriffe und Eigenschaften der Positionierung nicht ausreichend erklärt.
Ich schreibe immer nur eine Frgae...der Beitrag wird sicher umfangreicher werden.
Angenommen ich habe folgenden code:
- Code: Alles auswählen
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Positionierung</title>
<style type="text/css">
#eins{
width:200px;
height:200px;
background-color: green;
position: relative;
}
#zwei{
width:100px;
height:100px;
background-color: red;
position: absolute;
margin-left: 10px;
margin-top: 10px;
}
</style>
</head>
<body>
<div id="eins">
<div id="zwei">
</div>
</div>
</body>
</html>
Hier habe ich zwei ineinander verschachtelte divs.
div id="zwei" ist in div id="eins" verschachtelt.
div id="eins" ist mit position:relative angeben.
Warum eigentlich? Hätte hier nicht auch für
div id="eins" static..oder keine Angabe gereicht?
Oder muss ich deswegen bei div id="eins" angeben,
weil ich sonst div id="zwei" nicht mit absolute hätte
positionieren können? Braucht also ein absolute ein vorheriges relative?
