• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

[GELOEST] Pure CSS Parent Change ?

Kijupo

Neues Mitglied
Moin!

Ich stehe vor folgendes Problem. Möchte gerne in meinem Quellcode ein Übergeordnetes DIV via CSS ändern.
Und zwar soll die Klasse "header-logo" auf display: none; gesetzt werden, so bald in der Klasse "search" zusätzlich "active" gesetzt ist.

HTML:
<div class="container">
  <div class="header__main">
    <Link to="/" class="header-logo">
      <img src="favicon.svg" class="logo" alt="Titel" />
      <span class="title">Titel</span>
    </Link>

    <ul class="menu-container">
      <li class="search active" />
        <input></input>
      </li>
    </ul>

  </div>
</div>

Habe mich durchs Netzt gewuselt und bin auf :has gestoßen aber irgendwie hab ich wohl ein Denkfehler.

CSS:
.header-logo:has(> .search.active) {
  display: none;
}

... geht leider nicht.

kann mir da jemand weiterhelfen?

Lieben Gruß,
Kijupo
 
Werbung:
CSS:
.header__main:has(.search.active) .header-logo {
  display: none;
}

... hat funktioniert.
Manchmal sieht man vor lauter Bäumen den Wald nicht. :D
 
Zuletzt bearbeitet:
Zurück
Oben