Stylesheet im Stylesheet funktioniert nicht

[Michael Haszprunar]

Hi Forum,

Habe folgendes Problem. Ich definiere im <style>-Teil folgende Styles:

.border_red {border-width:7px; border-style:solid; border-color:#ff0000; padding:5px;}

.headline_small_red {font-size:12pt;font-family:Arial;font-weight:bold;text-align:center;text-decoration:underline;color:#ff0000;}

und möchte diese so verwenden:

<p class="border_red">
        <p class="small_headline_red">Überschrift</p><br>
        text
</p>

Soll also einen Absatz mit rotem Rahmen geben, darin eine kleine Überschrift, rot und unterstrichen und danach etwas Text.

Nun ist es so, dass wenn ich 2 <p>s verwende (wie oben), dann steht der gesamte text ausserhalb des rahmens. wenn ich 2 <div>s verwende, dann gehts, aber die kleien überschrift erhält keine formatierung (eben rot und unterstrichen).

Was mach ich falsch? ich hoffe doch, dass man diesen fall über CSS realisieren kann, oder?

Please help,
                 Michael H.

[Götz]

Hi Michael!

<p class="border_red">
        <p class="small_headline_red">Überschrift</p><br>
        text
</p>

Ich hab mir das jetzt nicht genauer angeschaut, aber ersetz den 2. p doch mal durch einen span.

2 p ineinander macht eh wenig Sinn.

MfG
Götz Bürkle

[Kerstin]

.headline_small_red {font-size:12pt;font-family:Arial;font-weight:bold;text-align:center;text-decoration:underline;color:#ff0000;}

<p class="small_headline_red">Überschrift</p><br>

»»

Hallo Michael,

Du hast einmal headline_small_red und einmal small_headline_red.
Das kann nicht gehen ;-)

Gruss Kerstin

[Michael Haszprunar]

Hallo Michael,

Du hast einmal headline_small_red und einmal small_headline_red.
Das kann nicht gehen ;-)

Gruss Kerstin

Oh Gott bin ich blind! Danke sehr *zerknirscht in die Ecke verkriech*

Michael

[Paule]

Hallo!

Der Unterstrich _ funktioniert bei den Style-Klassen-Namen leider nicht. Wenn du den Klassennamen änderst ohne den Unterstrich müsste es gehen.

Gruß, Paul

[Orlando]

Hi Forum,

Wir sind Forum.
Sie werden assimiliert.

.border_red {border-width:7px; border-style:solid; border-color:#ff0000; padding:5px;}

.headline_small_red {font-size:12pt;font-family:Arial;font-weight:bold;text-align:center;text-decoration:underline;color:#ff0000;}

<p class="border_red">
        <p class="small_headline_red">Überschrift</p><br>
        text
</p>

Warum so kompliziert verschachtelt?

<p class="border_red headline_small_red">bla foo</p> ?

Für Überschriften verwende besser die dafür vorgesehenen Tags.

LG Orlando

[Kai Lahmann]

hi

Soll also einen Absatz mit rotem Rahmen geben, darin eine kleine Überschrift, rot und unterstrichen und danach etwas Text.

h1{border-width:7px; border-style:solid; border-color:#ff0000; padding:5px;font-size:12pt;font-family:Arial,sans-serif;font-weight:bold;text-align:center;text-decoration:underline;color:#ff0000;}

<h1>Überschrift</h1>

..biddeschön.
Seiten-Überschift is H1 (untergeordnete dann eben H2, H3,...,H6).
Und die Schrift und den Border kannste zusammen angeben. Ansonsten noch eine Alternativ-Schrift, falls es kein "Arial" gibt.

Zu deiner unsprünglichen Lösung:
<p> dürfen nicht ineinander verschachtelt werden. Zumindest der äußere hätte ein <div> sein müssen. Das Problem, dass die untereinander stehen hast du übrigens den Frühzeiten von HTML mit "optional schließenden Tags" zu verdanken. Daher interessiert es Browser kaum, ob und vor allem wo ein </p> steht.

Grüße aus Bleckede

Kai