Warum spricht dieser CSS-Befehl nicht an? (Hierarchie?!)

mediamat

Erfahrenes Mitglied
Nachfolgend ein HTML-Schnipsel, wo das ganz mittlere Div namens "col-md-8" angesprochen werden soll. Ganz außen am Div steht eine Klasse "not-home" weil es die Codestelle zweimal gibt, einmal mit "not-home" einmal ohne:
Code:
<header id="masthead" class="site-header not-home" role="banner">
   <div class="header-wrap">
       <div class="container">
           <div class="row">
               <div class="col-md-8 col-sm-4 col-xs-12">
           </div>
       </div>
   </div>
</div>
Ich will jetzt dass ein CSS-Befehl NUR bei "not-home" und einer nur bei wenn OHNE "not-home" greift.
OHNE "not-home" funktioniert aber wirkt auch wenn MIT "not-home", das will ich nicht

Hier die CSS-Codes die ich bislang hab:
#masthead .row > div:nth-of-type(2)
Funktioniert bei "OHNE "not-home" und bei MIT "not-home", soll aber NUR bei OHNE "not-home"

#masthead.not-home .row > div:nth-of-type(2)
Funktioniert überhaupt nicht, wird nichtmal überschrieben, soll NUR bei MIT "not-home"

Wie muss ich das für "not-home" ansprechen?
 
Liegt hier blos ein (unvollständiger) Übertragungsfehler des HTML-Codes vor?

Dem (eingerückten) Code zufolge fehlt das schliessende </header>.

Gemäß der gezeigten HTML-Struktur ist das anzusprechende Element das erste Kindelement der Klasse .row - also lauten die korrekten Selektoren so:
CSS:
#masthead .row > div:nth-of-type(1) {...}
#masthead.not-home .row > div:nth-of-type(1) {...}
Ganz außen ... steht eine Klasse "not-home" weil es die Codestelle zweimal gibt, einmal mit "not-home" einmal ohne:
Ist Dir nicht bekannt, dass ein ID-Bezeichner (hier #masthead) im Dokumentbaum nur einmal enthalten sein darf? Oder beziehst Du Dich mit dieser Aussage auf zwei gesonderte Dokumente?

[edit]Tipp-Ex[/edit]
 
Zuletzt bearbeitet:
Oh das mit dem 2. Div war mein "Copy-Paste-Fehler" da ist vorher noch ein Div...dieses was ich ansprechen will ist tatsächlich das 2. und <header> ist auch geschlossen.
Es gibt #masthead auch nur einmal auf der Seite. Das ist per php-Als-if-Bedingung...#masthead.not-home gibt es nur wenn es nicht das Homeseiten-Template ist.

Der Fall ist aus einem WordPress-Template... vielleicht ist da irgendwo außerhalb des CSS noch was programmiert dass sich das nicht ändert lässt?? Keine Ahnung, aber kann halt einfach nicht den Fehler finden.
(Gerade fällt mir ein, vielleicht hab irgendwie immer im Vorschau-Fenster rumgemacht, da geht das manchmal auch bei neu laden nicht....Muss ich nochmal gucken...)
 
Der Fall ist aus einem WordPress-Template... vielleicht ist da irgendwo außerhalb des CSS noch was programmiert dass sich das nicht ändert lässt?? Keine Ahnung, aber kann halt einfach nicht den Fehler finden.
(Gerade fällt mir ein, vielleicht hab irgendwie immer im Vorschau-Fenster rumgemacht, da geht das manchmal auch bei neu laden nicht....Muss ich nochmal gucken...)
Tu' das, denn in meinem JSFiddle-Demo gibt's damit keine Probleme: https://jsfiddle.net/spicelab/mL13ta0t/
 

Neue Beiträge

Zurück