Difficulté classique : sur smartphone et tablette, la hauteur de la fenêtre d’affichage n’est pas accessible en indiquant « 100% », ni en indiquant « 100vh », car cette valeur peut changer quand on scrolle (éléments de l’interface du navigateur qui peuvent disparaître). « 100% » de la hauteur, dans ce cas, c’est systématiquement plus que la surface qu’on affiche réellement. Et donc, pour faire une interface « plein écran », c’est pénible, puisque les éléments du bas vont assez systématiquement dépasser en bas.
Solution en CSS :
height: 100% (ou 100vh);
height: -webkit-fill-available;
height: -moz-fill-available;
height: fill-available;