Farbige Überschriftenzeile

  • Hallo zusammen,


    ich habe folgendes geplant:


    Ich möchte eine neue Überschriftenart einführen. Diese soll so gestaltet werden, dass die ganze Überschriftenzeile mit einem farbigen Hintergrund hinterlegt ist. Als Trockenübung habe in einer html-Datei folgenden Code implementiert:


    Code
    .Überschrift {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 16px;
    font-style: normal;
    font-weight: bold;
    background-color: #C9C9C9;
    }
    <p class="Überschrift">Überschrift</p>


    Das hat auch soweit erst einmal funktiontiert. Jetzt möchte ich das in Joomla umsetzen. Dazu habe ich eine neue editor.css erzeugt und diesen Style dort hinterlegt. Jetzt kann ich auf diese Format über "Formate" in der Menuleiste verfügen.

    Leider setzt der Editor das aber nicht so um, wie ich mir das vorgestellt habe. Der Editor erzeugt folgenden Quellcode:

    Code
    <p><span class="ueberschrift_blauer_hintergrund">Überschrift</span></p>

    Das führt jetzt natürlich dazu, dass nicht die ganze Zeile / ganzer Absatz mit einer Farbe hinterlegt wird, sondern lediglich die einzelnen Wort. Nachfolgend noch einmal der Unterschied im Bild.



    Gibt es eine Möglichkeit, dass ich das wie gewünscht umsetzen kann? Leider habe ich alle Überschriften h1 - h6 schon anderweitig verbraucht...


    Vielen Dank für Eure Hilfe.


    Maumi


    Kleine Ergänzung: Im ersten Post war ein Fehler


    Code
    <p><span class="Überschrift">Überschrift</span></p>

    Einmal editiert, zuletzt von Indigo66 () aus folgendem Grund: Ein Beitrag von maumi mit diesem Beitrag zusammengefügt.

  • Es ist egal, wie das CSS heisst, in welches du es einfügst, solange es nur gelesen wird. Das hängt halt immer vom Template ab ;).


    Versuche es mal mit display: block; :


    Code
    .ueberschrift_blauer_hintergrund {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 16px;
    font-style: normal;
    font-weight: bold;
    background-color: #C9C9C9;
    display: block;
    }