Nach jeder Überschrift ein roter Punkt?

Hallo,

ich möchte gerne, dass nach jeder Überschrift (h1) ein roter Punkt steht. Ich bin mir sicher, dass man das in der style.css bearbeiten muss und habe den entsprechenden Quelltext herauskopiert.

Kann mir bitte jemand sagen, wo genau ich was einfügen muss?

#masthead h1 {
    text-transform: uppercase;
    padding: 19px 0 0 0;
    margin: 0;
    font-size: 2.2em;
    font-weight: bold;
}


#masthead h1 a {
    color: #7d7d7d;
    text-decoration: none;
}


#masthead h1 a:hover {
    color: #000;
}

Vielen Dank schon mal.

Zitat von maxe

Ein roter Punkt? Evtl. als background-image mit der Ausrichtung right.

Kann man in einer CSS-Datei denn HTML Code einfügen?

Leider will das nicht so wirklich funktionieren (siehe hier: Vote21. - Verein zur Förderung junger Demokratie e.V.).

Der rote Punkt soll bei der Überschrift "Willkommen" stehen. Zum ausporobieren habe ich unten einen Text als h1 ("Hallo wie gehts") deklariert. Bei diesem geht es. Allerdings soll die obere Überschrift diesen Punkt enthalten.

Ich habe die style.css durchsucht und den von dir geposteten Code sowohl bei "#masthead1" als auch bei "#content entry" eingefügt. Bei letzterem geht es ja, beim ersten aber leider nicht. Und genau bei diesem soll der rote Punkt ja auch eingefügt werden.

Zitat von maxe

"Willkommen" ist ja auch keine H1 Überschrift, sondern eine H2:
#content h2

Ok danke, ich dachte es wäre wohl selbstverständlich, dass "Willkommen" eine H1 Überschrift wäre. Werde es ändern. Vielen Dank.

Es will immer noch nicht funktionieren:

#content h2.pagetitle {
    background: transparent url(images/punkt.png) no-repeat scroll left top
     //border-bottom: none;
    //background: #bebebe url(images/bg_corner_topright.gif) top right no-repeat;
    font-family:"trebuchet ms",arial,sans-serif;
    color: #fff;
    margin: 0 15px 20px 15px;
    padding: 3px 5px;
    font-size: 1.3em;
}


#content .entry h1 {
         background: transparent url(images/punkt.png) no-repeat scroll left top;    
     font-size: 2em;
         color: #646464;
}


#content .entry h2 { 
         background: transparent url(images/punkt.png) no-repeat scroll center top;
         text-align= left; 
         font-size: 1.8em; 
         color: #646464; 
         border-bottom: none;
}


#content .entry h3 {
        background: transparent url(images/punkt.png) no-repeat scroll right top;
        text-align= center;    
        font-size: 1.5em;
    color: #646464;
}

So sieht es aus: Vote21. - Verein zur Förderung junger Demokratie e.V.

Die anderen Überschriften kann ich ja problemos ändern wie ich will. Ausgerechnet die Überschrift "h2.pagetitle" nicht.

Zitat von maxe

Warum nimmst du nicht die Klasse die ich vorgeschlagen hatte?

Sorry hab das übersehen. Weißt du wie ich den Punkt in einer Zeile mit der Überschrift hinkriege? (Analog zum Logo?). Muss ich dazu alles in eine (Quelltext-)Zeile schreiben?

Zitat von maxe

SELFHTML: Stylesheets / CSS-Eigenschaften / Hintergrundfarben und -bilder
background: Hintergrundbilder: CSS-Referenz auf CSS 4 You - The Finest in Stylesheets

Habe die Links studiert. Allerdings finde ich dort keine Angabe dazu wie man den Punkt unmittelbar nach der Überschrift setzt. Finde dort nur Angaben dazu, dass man den Punkt rechts, in der mitte oder links platzieren kann. Also scheint es keine Möglichkeit hierfür zu geben? Oder irre ich mich?