Het formaat van het scherm kan variëren per pagina. Om de beste ervaring te bieden aan de gast, past onze reserveringsmodule zich aan de grootte, lengte en hoogte van het scherm aan.

Om een vaste lengte te vermijden en om te voorkomen dat een scroll optie verschijnt, gebruiken we Media Queries om deze aan te passen aan de verschillende schermformaten van een bepaald apparaat.

Gebruik een Class in het frame:

<iframe class="thefork" src="https://module.lafourchette.com/nl_NL/module/56567-a3fd1"></iframe>

Plak de volgende stijlen vóór de tag </head>:

<style type="text/css">

.thefork{
width: 100%;
border:none;
overflow: scroll;
}
/* Media queries widget */ 
@media only screen and (max-width : 320px) { 
    .thefork{
    min-height: 840px;
    }
}
@media only screen and (min-width : 321px) and (max-width : 516px){
    .thefork{
    min-height: 650px; 
    }
}
@media only screen and (min-width : 517px) { 
    .thefork{
    min-height: 550px; 
    }
}
</style>

Vanaf nu verandert de hoogte van het frame afhankelijk van de breedte van het scherm en het html-blok dat het bevat. De relatie tussen deze afmetingen werkt als volgt.