Sie sind hier: Startseite -> CSS-Grundlagen -> Positionierung

CSS-Grundlagen: CSS-Positionierung

CSS-Positionierung: Aufteilung des Layouts

Eine wesentliche Aufgabe von Cascading Style Sheets (CSS) ist die Positionierung von Elementen auf einer Webseite. Sie sind zum Teil nervig und zum Teil genial anzuwenden. Nervig deshalb, weil die Browser, vor allem ältere Versionen, nicht immer das machen, was man eigentlich eingestellt hatte und genial, weil die Steuerung der einzelnen Spalten (Div-Container) oder Textbereite (p-Tag) sehr einfach umzusetzen sind.

Dabei gibt es verschiedene gedankliche Herangehensweisen. Unter der Positionierung von Elementen auf einer Webseite versteht man zum einen die direkte Positionierung beispielsweise einer Ebene (Div-Tag) auf der Seite oder aber auch ihr Abstand zu den anderen Elementen, um ein schlüssiges CSS-Layout erstellen zu können.

Elemente können direkt an einen bestimmten Punkt der Seite angeordnet werden, wobei es auch die Möglichkeit gibt, eine absolute Positionierung durchzuführen. Elemente können aber auch in Relation zu anderen Elementen angebracht werden, wobei vor allem der float-Befehl zum Einsatz kommt.

Schließlich erfolgt die Positionierung auch durch die Bestimmung der Abgrenzungen. Nicht immer soll an allen vier Seiten eines Elementes der gleiche Abstand erfolgen und daher kann für jede Himmelsrichtung ein anderer Wert angeführt werden.

Die Positionierung ist neben der Textgestaltung der wohl wichtigste Bereich von CSS und sorgt für so manches Kopfweh bei Anfängern, ist aber ein dankbares Werkzeug. Alleine schon die Möglichkeit, die Ebenen ohne Berühren der eigentlichen Programmierung in der Breite für tausende Seiten auf Knopfdruck ändern zu können, ist bei großen Projekten Goldes wert.



Sie wollen den Artikel teilen?
bei Twitter teilen bei Facebook teilen Artikel per E-Mail empfehlen