Forum libero

Mentre dormite, mentre Yoda depenna l'arabo dal curriculum, mentre i musulmani tramano attentati e ogni idiota progetta una strage da rivendicare a nome dei musulmani, nottetempo Gatto Insonne s'arrovella a lume di candela sui misteri di CSS.

Seguendo la logica del tema di Wordpress che sto modificando, ho definito un margine inferiore per spaziare i vari elementi tipo blocco, quali H# e P. Tuttavia, quando degli H# si trovino adiacenti, ad esempio

<h1>Heading 1</h1>

<h2>Heading 2</h2>

<h3>Heading 3</h3>

<h4>Heading 4</h4>

<h5>Heading 5</h5>

<h6>Heading 6</h6>

vorrei che questo margine inferiore fosse zero in modo di avere

Heading 1
Heading 2
Heading 3
Heading 4
Heading 5
Heading 6

invece di

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5

Heading 6

(semplificando un po' il problema).

Allora ho messo nel foglio di stile

.pippo h1 + h2 {
margin-bottom: 0px;
}

.pippo h2 + h3 {
margin-bottom: 0px;
}

.pippo h3 + h4 {
margin-bottom: 0px;
}

.pippo h4 + h5 {
margin-bottom: 0px;
}

.pippo h5 + h6 {
margin-bottom: 0px;
}

ma ottengo

Heading 1

Heading 2
Heading 3
Heading 4
Heading 5
Heading 6

perché il selettore .pippo h1 + h2

seleziona all'interno di .pippo un H2 immediatamente preceduto da un H1 (e i selettori restanti un H3 preceduto da un H2, e così via) per dargli margine inferiore nullo, ma non l'H1 che quindi continua ad avere il margine.

Che selettore dovrei usare per comprendere anche l'H1?