CSS und die Möglichkeiten Einstellungen

[Gast_CaVo_*]

Da wir hier in letzter Zeit vermehrt Diskussionen um Seitengestaltung hatten (Pro/Contra Frames, Tabellen oder Div's, etc) mal ein kleiner Link zum Thema CSS:

http://www.csszengarden.com

Das ist schon immer wieder erstaunlich, welche Möglichkeiten einem diese Form der Seitengestaltung bietet.


Gruß
Carsten

[Netizen]

Den Hupfer meinte ich aber noch anders; anstatt nebeneinander folgen die mittlere und rechte Spalte beim "Dampf ablassen" ein paar Zentimeter weiter unten. Ist jetzt für diese Seite nicht mehr unbedingt wichtig, kann ja aber woanders noch mal passieren. Da hätte ich bitte gern noch einen Hinweis!

Ach das. Das dürfte mit dem Standard-Verhalten eines div-Elements sowie unpassenden Angaben im Stylesheet zusammenhängen.

Zum einen ist ein div-Element ein sogenanntes Block-level Element, diese werden vom Browser generell untereinander angeordnet, solange man nicht mit CSS dazwischenfunkt. Am einfachsten sieht man das, wenn man den divs mal vorübergehend einen farbigen Rahmen verpaßt (border: 1px solid red)

Dazu kommen in Deinem Stylesheet mehrfache position: absolute - die solltest Du wieder entfernen.

Absolute Positionierung ist ein großes Kapitel für sich und sollte nur verwendet werden, wenn man die dahinterstehenden Konzepte sowie CSS im Allgemeinen - insbesondere die verschiedenen Arten von Elementen und deren Standard-Verhalten - verstanden hat. Darüberhinaus ist absolute Positionierung oftmals gar nicht notwendig, vieles läßt sich auch einfacher lösen: In Deinem Beispiel entweder mit einer Tabelle oder 3 divs, wobei das linke und das mittlere per CSS ein float: left sowie eine Breitenangabe (z.B. 33%, Breitenangabe ist bei floats vorgeschrieben!) bekommen.

Details dazu (und zu praktisch allem anderen) findest Du in der offiziellen Spezifikation:

CSS2 Specification
http://www.w3.org/TR/CSS2/

Alternativ auch in der deutschen Übersetzung, wobei allerdings nach Möglichkeit das Original vozuziehen ist:

Cascading Style Sheets, Level 2 Deutsche Übersetzung
http://www.edition-w3c.de/TR/1998/REC-CSS2-19980512/

3. Die <br> hätte ich mir auch gern geschenkt, ich habe aber im selfhtml nichts so zu den Zeilenabständen gefunden, wie ich mir das vorstelle. Da muß man wohl jeder Zeile einen <p> Absatz mit margin zuordnen, richtig?

Wäre eine Möglichkeit, wenn auch wahrscheinlich nicht die beste. Kommt halt immer drauf an, was man erreichen möchte. Es gibt (fast) immer mehrere Möglichkeiten.

4. Listen muß ich noch lernen, die waren mir damals in html zu umständlich.

Sind aber sehr nützlich und lassen sich obendrein sehr vielfältig einsetzen. Darüberhinaus muß - dank CSS - eine Liste auch nicht immer wie eine Liste aussehen. Es ist z.B. problemlos möglich, die einzelnen Listenpunkte nebeneinander statt untereinander anzuordnen. Unabhängig von der Darstellung ist eine Liste aber oftmals besseres HTML und semantisch sinnvoller als irgendwelche Konstrukte mit unzähligen <br>s.

Sichtbar wird das dann, wenn man CSS abschaltet oder einen Browser bzw. User Agent verwendet, der mit CSS überhaupt nichts anfangen kann. Dann zeigt sich, ob der HTML-Code sinnvoll aufgebaut ist.

5. Ich habe die Originalseite als Tabelle; und wollte mal das mit den DIVs lernen. Da bin ich ja echt erleichtert, daß ich die Seite erstmal so lassen kann.

Auch hier: Kommt drauf an.

Beide Techniken - Tabellen und divs - haben ihre Vor- und Nachteile.

Gruß
n!