[Erledigt] Sichtbarkeit des Child vom Parent abhängig

[Shalec]

Hallo,

wenn ich folgenden Code einfach ausführe ist "Test2" lesbar. Bei der Einstellung, soll dies aber unsichtbar bleiben. Folglich muss ich die Parent-Eigenschaften im Child vererben, ohne sie zu überschreiben. Gibt es eine CSS-Option oder eine PHP Hilfsmöglichkeit, um das zu realisieren?

Wenn das Parent unsichtbar ist, soll das Child ebenfalls unsichtbar sein, egal bei welcher Einstellung das Child ist.

<div style="visibility: hidden">
    Test1
    <div style="visibility: visible">
        Test2
    </div>
</div> 

Viele Grüße und vielen Dank,
Shalec

[ChristianK]

http://www.css4you.de/wscss/css08.html#inherit

[Shalec]

http://www.css4you.de/wscss/css08.html#inherit

Klasse! Das funktioniert auf anhieb! Vielen Dank

[nikosch]

display:none;

[monolith]

nikoschs Lösung scheint mir die - sofern im Kontext passende - bessere zu sein. Shalecs Lösung adressiert in meinen Augen nicht zu 100% das Problem. Ist ein Elternelement mit display: none ausgeblendet, ist auch das Kindelement ausgeblendet. Ohne Wenn und Aber. Egal ob es einen Wert auf inherit gesetzt hat oder nicht. Setzt man aber in einem Stylesheet für das Kindelement visibility: inherit und dann an anderer Stelle visibility: visible !important, ist es doch wieder sichtbar.

[ChristianK]

Wobei meiner Meinung nach das Überschreiben mit !important etwas suspekt ist.

[monolith]

Ich hatte die Aussage des TE "egal bei welcher Einstellung das child ist" so interpretiert dass er so etwas auch erlaubt

[Shalec]

Hallo. Habe eben erst gesehen, dass hier noch weiter geschrieben wurde.

Also ich arbeite dort mit der Javascriptunterstützung und wechsle über JS die Klasse der jeweiligen Box. Dabei sollen die Childs (egal in welcher Stufe) nur sichtbar werden, wenn die Parent sichtbar ist. Daher habe ich folgende Hierarchie in CSS:

.parent{
  visibility: hidden;
}
.clickedparent{
  visibility: visible;
}
.child{
  visibility: hidden;
}
.clickedchild{
  visibility: inherit;
}

Dadurch wird beim Wechsel des sichtbaren Bereiches alles ausgeblendet, was zum vorherigen gehört hat. Da ich eine Funktion in JS habe, die erkennt, ob eine Div sichtbar ist und entsprechend die Klasse wechselt, war das die einfachste Lösung.