Étendre un élément positionné relatif à la hauteur du conteneur complet

J'ai un div directement sous le corps. Mon HTML ressemble à ceci:Étendre un élément positionné relatif à la hauteur du conteneur complet

<body> 
<div class="parent"></div> 
</body>

Et je l'utilise css est la suivante:

.parent { 
    border:1px solid black; 
    bottom:10px; 
    position:relative; 
    top:100px; 
    width:500px; 
}

Ce div ne marche pas extensible à toute la hauteur du corps viewport/disponible. Cependant, si je change la position en absolu, ça s'étend.

Existe-t-il un moyen d'obtenir un élément relatif relatif à la hauteur de l'élément conteneur. J'ai essayé la hauteur à 100% et ça marche mais ça me donne une barre de défilement verticale car l'élément est positionné à 100px de TOP.

Source

2010-03-25 Rajat

Les termes haut, bas, gauche et droite sont généralement utilisés pour le positionnement absolu. Si vous voulez qu'un conteneur div soit aussi grand que le conteneur parent, vous devez spécifier les termes height et width, et utiliser un pourcentage ou un entier avec une échelle de mesure attachée comme 'px'. Si vous vous inquiétez d'une barre de défilement, utilisez simplement la règle overflow:hidden;

Source

2010-03-25 23:27:19 Scarface

-1 pour cette solution car vous pourriez masquer accidentellement un texte qui aurait autrement été lisible en faisant défiler vers le bas. – Shawn

C'est vrai, mais que suggérez-vous? Je pense qu'un bon développeur testerait d'abord sa page sur plusieurs appareils. @Shawn +1 – 11684

Étendre un élément positionné relatif à la hauteur du conteneur complet

Répondre

Questions connexes