CSS hauteur maximale avec héritage

Question

La référence CSS indique explicitement que max-height n'est pas héritée. Le problème est, je veux qu'il soit hérité. Cependant, je n'arrive pas à obtenir l'incantation CSS correcte. La chose est, j'ai une classe CSS que je voudrais demander à DIVs puis appliquer que tous les enfants de ladite DIV honorer la propriété max-height:

.my-viewer { 
    max-height: 800px; 
} 

* { 
    max-height: inherit; 
} 

Malheureusement, le code ci-dessus ne fonctionne pas. Dans les outils de développement de Chrome, par exemple, le paramètre "inherit" de "max-height" est barré, comme désactivé. Une idée de comment résoudre ce problème?

Answer 1

Peut-être que je suis ne comprend pas mais ne devrait pas ce travail?

.my-viewer { 
    max-height: 800px; 
} 

.my-viewer * { 
    max-height: inherit; 
} 

Ce serait tous les éléments enfants de .my-viewer. Si cela ne fonctionne pas, ce qui devrait fonctionner est max-height:100% car ils sont les enfants de .my-viewer. Et je suppose que seulement .my-viewer divs sont ce que vous voulez hériter, pas tous les éléments tels que ap et ainsi de suite.

.my-viewer { 
    max-height: 800px; 
} 

.my-viewer div { 
    position:relative; 
    max-height: 100%; 
} 

EDIT: Si vous êtes à la recherche d'une utilisation plus spécifique, le sélecteur >.

.my-viewer > * ou .my-viewer > div

Answer 2

Vous devriez probablement utiliser un sélecteur CSS différent:

.my-viewer { 
    max-height: 800px; 
} 
.my-viewer * { 
    max-height: inherit; 
} 

Mais attention, que cela ne fonctionnera pas dans IE de toute façon (ou au moins avant IE 8), Voir here

Answer 3

Cela devrait fonctionner

* { max-height: inherit; } 

.my-viewer { max-height: 800px; }