Hallo KonRad
Weil die Boxen (divs) abgerundete Ecken haben. Das erreiche ich durch die Pseudoklassen :before und :after. Die Ecken-Bilder haben dabei das Format 16*16. Damit der Text nun nicht in die Ecken hineinragt, wird ein Abstand von 16px gehalten.
Das hatte ich mir gedacht, war mir aber nicht sicher.
Darüber: Text (<p>). Darunter nichts -- zumindest nicht im selben Kasten. Ich überlege im Moment, ob hier die Trennlinie überhaupt sinnvoll ist -- wenn ich sie durch einen border-bottom des letzten <p> ersetze, fällt auch der ganze Ärger weg.
Genau darauf wollte ich hinaus, da du dies hr mittels "height: 0;" sowieso
ausblendest und stattdessen den border-top anzeigst.
Ich wollte das aber ohne diese Information nicht vorschlagen.
Wenn die hr für Browser ohne CSS vorhanden sein soll, könnte diese auch ohne
border-top drin bleiben.
Es ist die *einzige* CSS-Lösung.
Die einzige rein-CSS-Lösung, die leider nicht im IE funktioniert.
Eine Möglichkeit mit ein paar zusätzlichen Elementen wäre
http://aktuell.de.selfhtml.org/tippstricks/css/runde_ecken/index.htm.
Auf Wiederlesen
Detlef
- Wissen ist gut
- Können ist besser
- aber das Beste und Interessanteste ist der Weg dahin!