CSS Hauteur de travail mais min-height ne fonctionne pas

Question

J'ai un étrange problème plutôt étrange. Le problème est un petit qui est que je veux définir min-height à 100% qui est le contenu de la page devrait couvrir l'écran entier de l'utilisateur et si possible la page devrait s'étendre vers le bas si le contenu dépasse 100%. Un moyen simple serait de définir min-height: 100% et de définir la hauteur: auto c'est exactement ce que je veux, mais peu importe combien de fois je l'essaie le problème reste là. J'utilise height auto et min-height: 100% sur tous les éléments mais ça ne marche pas. Si j'enlève min-height pour n'inclure que la hauteur: 100% alors ça fonctionne comme un charme mais quand le contenu est plus grand, il déborde tout le pied de page.

S'il vous plaît aidez-moi ici est css:

html, body, container, row, col-lg-3, col-lg-9 { 
    min-height: 100%; 
    height: auto !important; 
    height: 100%; 
} 
.container { 
    max-width: 1170px; 
    min-height: 100%; 
    height: auto !important; 
    height: 100%; 
} 
.col-lg-3 { 
    min-height:100%; 
    height:100%; 
} 
.col-lg-9 { 
    min-height: 100%; 
    height: 100%; 
} 

Voici la page montrant le problème: http://contestlancer.com/ai/GP/

Answer 1

Oui, c'est une douleur, mais c'est comment cela fonctionne. La hauteur peut être héritée des parents positionnés mais pas quand ceux-ci ont une propriété min-height.

Les enfants d'éléments qui ont un min-height ensemble à 100% ne peut pas hériter de la hauteur de leurs parents par pourcentage ...

https://stackoverflow.com/a/8468131/1491212

specs CSS2.1:

Le pourcentage est calculé par rapport à la hauteur du bloc contenant la boîte générée . Si la hauteur du bloc contenant n'est pas spécifiée explicitement (c'est-à-dire qu'elle dépend du contenu height), et que cet élément n'est pas positionné de manière absolue, la valeur est calculée sur 'auto'.

utilisation position: relative; height: 100% sur les conteneurs pour contourner le problème, et ajouter min-height: 100%; au plus profond enfant.