Positionieren mit CSS

Oft ist es nötig oder sinnvoll ein Objekt im Browser bzw. Seite fest zu positionieren. Hier bedient man sich wieder mit CSS.
Egal welche Bildschrimgröße der Besucher hat, das Objekt bleibt immer an der selben Stelle.

Beispiel für einen Text:

Diese Zeile ist mit CSS fest positioniert.

 

 

So sieht es dann im Quelltext aus:

<div id="text">Diese Zeile ist mit CSS fest positioniert.</div>
<style type="text/css">
#text {
position: absolute;
left: 400px;
top: 150px;
}
</style>

Hier der Code zum Kopieren:

 

Natürlich geht das auch mit einem Bild

Beispiel

 

 

 

 

So sieht es dann im Quelltext aus:

<img src="../bergwandern/test1.jpg" alt="Beispiel" name="bild" width="100" height="75" id="bild">
<style type="text/css">
#bild {
position: absolute;
left: 450px;
top: 650px;
}
</style>

Man kann auch in bekannter Weise eine Positionierung in eine CSS-Datei einbinden und nach Bedarf auf ein Element anwenden.
Wenn man mehrere Fixpunkte setzen will, ändert man einfach den Namen (z.B. text , bild usw. ) und die Position.
Die Position geht immer von links oben aus !