Bonjour !
J'ai une petite carte interactive à la google maps. Quand on clique sur certaines terres, cela ouvre une fenêtre modale qui possède la classe pinbox. Cette fenêtre est centré horizontalement et verticalement en css et ce doit donc de posséder une height définie. Pour centrer, je procède comme ceci (le parent est en position relative) :

.pinbox{
   width: 475px;
   position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
 }

Seulement voilà, j'aimerais que la hauteur s'adapte au contenu de cette .pinbox afin qu'elle ne prenne pas toute la hauteur du parent et soit centrée. J'ai fait ceci mais tout mes éléments ont alors la même hauteur (à savoir la hauteur du parent).

$('.pinbox').each(function(){
       var height = $(this).height();
        $(this).css("height", height + "px");
});

Je pense que ce n'est pas vraiment la bonne méthode mais je ne vois pas comment faire.
Ca paraît tout bête mais bon...
Merci de votre aide :D

1 réponse


La meilleurs solution dans ce cas est indéniablement flexbox :)
ça t'évitera d'avoir des position absolute à gauche à droite, et une couche de js en plus;