Hide div, wenn nav geöffnet ist

Question

Ich habe eine sehr einfache Seite mit dem Standard-Bootstrap-Nav, die auf kleinem Bildschirm zusammenbricht. Direkt unter dem Nav habe ich ein div welches ich nicht zeigen möchte wenn das liCSS class dropdown open hat. Ist es möglich, dies nur über CSS oder muss ich die jQuery/Javascript Route gehen?

.navbar-nav > li.dropdown.open { 
/*How can I hide the div class="inner-details" here*/ 
} 

Answer 1

Wenn das Drop-down-Element nicht mit einem anderen gewickelt ist, könnten Sie möglicherweise die adjecent Geschwister-Selektor wie folgt verwenden:

li.dropdown.open + .inner-details { 
    display: none; 
} 

Sonst könnten Sie Tricks mit negativen Marge und z-index, effektiv Inhalte von unterhalb des Drop-downs gleiten lassen, aber das führt zu einem unübersichtlichen Layout.

Es gibt keinen Bösen bei der Verwendung von JavaScript. Bootstrap selbst verwendet es für die Navigation, wenn ich mich richtig erinnere.