divs
verschachteln
positionieren
relativ
Vorhang zu
Action!
Hallo ...
später Hallo
ein Spalt
Variable
auf geht's!
abschneiden
schööön!
weiteres heiteres
Klappe zu!
Nun geht's also darum, unsere drei Komponenten übereinander zu legen: das Bild von Marilyn,
den Vorhang und die Willkommenstafel. Dazu werden wir diese drei <div>s
positionieren, was zunächst mal heisst, dass sie <style>-Angaben
kriegen. Zur Positionierung verwenden wir position: absolute, was bedeutet,
dass die Positionierungsangaben sich auf das übergeordnete Element beziehen, und das ist
in unserem Falle die <div> mit der Id alles.
Hier siehst du die Anpassungen im <style>-Bereich:
<style type="text/css"> #marilyn { position: absolute ; top: 0em ; left: 0em } #vorhang { position: absolute ; top: 0em ; left: 0em ; background: url(wtuell.gif) } #willkommen { position: absolute ; top: 1em ; left: 1em } </style>
Hat sich nun schon was geändert? Hier siehst du's.
Tatsächlich, einen Schritt sind wir schon mal weiter. Aber noch immer bereitet uns der Vorhang
etwas Kummer, und nun sind auch noch die beiden <hr />-Elemente verrutscht.
Aber das kriegen wir schon noch in den Griff.