nicht angemeldet
Moin Detlef,
... In diesem Div befindet sich das hr, das links und rechts jeweils 16px Abstand vom Rand haben muss.
Warum genau 16px?
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.
Was befindet sich über und was unter der hr?
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.
(ich verwende :before und :after, um dem div runde Ecken zu verpassen).
Ob das die optimale Lösung ist?
Es ist die *einzige* CSS-Lösung.
Füge bitte etwas mehr drum herum in dein Beispiel ein, oft ergibt sich aus
dem Zusammenhang eine Lösung.
Ok, ich habe jetzt die ganze Sache mit den runden Ecken eingefügt, obwohl das IMO nicht zur Lösungsfindung beiträgt.
http://madrat.net/tmp/hr-test.html
Ich denke aber, ich lasse den <hr> weg, Border ist besser. ich wäre allerdings trotzdem an einer Lösung des Problems interessiert, wenn jemand eine weiß.
Gruß,
KonRad -