Ajouter un Scroll sur un élément avec une hauteur variable

Par Eric237, il y a 5 ans


Mon but est d'ajouter la scroll bar au contenu de ma boîte de dialogue. Le soucis ici c'est la boîte de dialogue n'a pas une hauteur fixe. Mais par contre je sais que la hauteur totale c'est 95% de la toute la page.

.modal { height: 95%; /* Qui ne fonctionne pas */ overflow-y: scroll }

S'il-vous-plaît comment est-ce que je dois m'y prendre ?

7 réponses

Arzou, il y a 5 ans

Salut,
ta modale est à 95%, mais est ce qu'elle est positionnée par rapport à son container avec une taille définie ? Parce que sinon, elle sera à 95% de rien :)

Eric237, il y a 5 ans

le parent est en position fixe, top, letf, right, bottom 0

Arzou, il y a 5 ans

Oui donc ton parent n'a pas de hauteur définie. Il faut que tu la définisse, sinon, ta modale fera 95% de .. rien ;)

EDIT: J'ai répondu un peu vite dsl. En effet, vu que tu as contrain ton parent à faire 100% du viewport, ta modale devrait faire 95% de hauteur.
Ton parent fait bien 100% du coup ?
Ta modale est bien directement l'enfant du container à 100% ?

Eric237, il y a 5 ans

oui effectivement mon container fais bien 100% du viewport, et le modal est l'enfant direct.

je me dit bien qu'avec le js je peux récupérer la taille réel de l'élément pour définir un height.

Un truc du genre:

container.style.height = container.offsetHeight

c à

Arzou, il y a 5 ans

Non ça devrait marcher sans. Pas besoin de rajouter du JS pour ça.
Quand tu inspecte l'element dans ton navigateur, tu vois bien les styles applicqué ? Il n'y en a pas d'autre qui passent par dessus ?

Eric237, il y a 5 ans

Lorsque j'inspecte il y'a pas de code qui écrase le miens

Arzou, il y a 5 ans

Est ce que tu pourrais mettre des imprim ecran, ou mettre ton bout de code sur codepen ou un truc du style pour qu'on puisse regarder ?