Mission

Mission : un titre hero qui casse sur mobile

Diagnostiquer les effets cumulatifs de em et le bug de 100vh sur mobile, puis proposer des unités robustes.

Contexte

Sur landing.css, un titre hero utilise height: 100vh pour occuper tout l'écran, et son texte est stylé avec trois <span> imbriqués ayant chacun font-size: 1.2em. Sur smartphone, l'utilisateur voit une bande vide en bas de la section au chargement, qui disparaît en scrollant ; par ailleurs le texte du troisième span paraît anormalement énorme comparé à la maquette.