Problème d'affichage bloc div

Salut, j'ai pas de solution miracle tres honnêtement mais ca fait le job, faudra tester sur différent format d'écran.
Si vous avez accès à la partie css ajouter ou modifier les différentes class/id suivants, sinon vous placez les valeurs indiqués sur les éléments correspondants même si je penses que l'iframe vous n'y avez pas accès

#apartmentIframeAll {
     height: 500px; 
}

.smoobu-booking-tool-container {
     height: 100%;   
 }

 .smoobu-booking-tool-container iframe {
     height: 100%;   
 }

Apres si vous avez accès à la partie javascript, vous pouvez faire en sorte que #apartmentIframeAll ne fasse 500px de haut que si un calendrier est ouvert.

Bon courage

Bonsoir Mickael,

Merci tout d'abord de votre réponse.

Effectivement, cela corrige une partie du problème.
En effet, quand on clique sur rechercher, le calendrier s'affiche correctement pour faire une recherche.

Cependant, en cliquant sur rechercher, le résultat s'affiche et dans ce cas, c'est la liste des disponibiltés qui reste masqué.
C'est un div avec uen id #apartmentListContainer
J'ai essayé le bout de code avec cette id en vain.

Bien sur, en mettant une valeur plus forte que 500px, la liste s'affiche correctement, mais normalement, le bloc div doit pouvoir s'agrandir de lui-même.

Malheureusement, pas d'accès au java, ni à l'Iframe....

Je viens de mettre à jour le site d'essai avec votre réponse, vous pourrez-voir ainsi le résultat :
https://www.auxportesdelabaie.fr/essai/reservation-c.html
https://www.auxportesdelabaie.fr/essai/reservation-c2.html

Merci d'avance de votre aide si vous comprenez plus pourquoi.....

Bien à vous,

Samuel.

Bonsoir, apres quelques essaie j'ai trouvé une solution qui pourrait peut-être vous arranger

ajouté dans votre feuille de style ceci. Si la bar de scroll vous dérange vous pouvez toujours la stylisé ou la rendre invisible.

#apartmentListContainer {
   height: calc(100vh - 145px);
   overflow-y: scroll;
}

Apres avoir fait un léger tour vous avez le même pb sur vos autres formulaire, le principe est le même vous ciblé l'element sous le formulaire ( celui avec les dates ) et vous appliquez le même css qu'au dessus.

Bonjour Mickael,

Merci de votre réponse.

J'ai mis en ligne les nouvelles versions sans réel amélioration.

Par contre coment styliser la barre de scroll ?

Bien à vous.

Samuel

Bonsoir,

Il semblerait que vous n'ayez pas mis au bon endroit le css que j'ai mis plus haut

vous avez ciblé les elements #apartmentIframeAll .smoobu-booking-tool-container iframe et .smoobu-booking-tool-container alors qu'il ne fallait cibler que l'element #apartmentListContainer

Je remet le css à intégrer

#apartmentIframeAll {
     height: 500px; 
}

.smoobu-booking-tool-container {
     height: 100%;   
 }

 .smoobu-booking-tool-container iframe {
     height: 100%;   
 }

 #apartmentListContainer {
   height: calc(100vh - 145px);
   overflow-y: auto;
}

Thanks for sharing such great information, I highly appreciate your hard-working skills as the post you published have some great information which is quite beneficial for me, I hope you will post more like that in the future. Charter Panorama

Bonsoir,

Merci Mickael de nouveau pour votre retour.
Impeccable pour les calendriers, mais de nouveau, dès quel'on appui sur recherche, aucun scroll et une liste incomplète.

Mon presta m'a envoyé ce code à intégrer mais sans effet également :

html {
scroll-behavior: smooth;
}

De nouveau, j'ai mis en ligne les nouveau essai :

https://www.auxportesdelabaie.fr/essai/reservation-c2.html

Merci encore de votre aide.

Bien à vous,

Samuel.

Bonsoir,

Merci Mickael de nouveau pour votre retour.
Impeccable pour les calendriers, mais de nouveau, dès quel'on appui sur recherche, aucun scroll et une liste incomplète.

Mon presta m'a envoyé ce code à intégrer mais sans effet également :

html {
scroll-behavior: smooth;
}

De nouveau, j'ai mis en ligne les nouveau essai :

https://www.auxportesdelabaie.fr/essai/reservation-c2.html

Merci encore de votre aide.

Bien à vous,

Samuel.

Bonsoir, je penses que le problème est que le style appliqué dans la balise <style> pour l'élément ayant l'id #apartmentListContainer, n'est tout simplement pas pris en compte.
Vous n'allez pas pouvoir faire grand chose de plus très honnêtement, faut revoir l'intégration la.

Quand vous parlez de votre presta c'est quoi, un Dev ? la personne qui vous a fourni la lib qui gère les réservations ?
Dans tout les cas soit il n'a pas compris votre demande, soit ne l'écoutez plus parce que la solution qu'il vous donne n'a rien à voir avec votre problème.
Si le presta est un dev, faut qu'il vous refasse le tout.
Si le presta est la personne qui vous fourni la lib, ben faut voir avec eux si il peuvent ajouter du css pour la partie qui ne fonctionne pas.

Bonsoir Mickael,

Merci de votre réponse.

Effectivement, le code est fourni par le developpeur de l'application de gestion de nos réesrvation en ligne.
Biennoté pour votre retour, je vais voir avec eux pour qu'il essaye de me régler le problème.

En tout cas, merci de votre temps et aide.

Bonne soirée et bien à vous.

Cordialement,

Samuel