Summary
Dans cette vidéo, je montre à Louise (et aux spectateurs) comment régler les dimensions et les marges d’un conteneur afin qu’il s’affiche correctement sur tous les écrans, notamment en mode téléphone. Je commence par inspecter le conteneur principal et je fixe sa largeur à 688 px, puis j’applique la même largeur (1688 px) au sous‑conteneur situé en bas. J’explique que l’alignement est par défaut et qu’aucune autre valeur n’est définie, puis je précise que la largeur du fond doit être réglée à 100 % pour occuper tout l’espace disponible. Ensuite, je remarque qu’une petite marge est toujours appliquée automatiquement dans le fond. En ouvrant les paramètres avancés, je montre les marges actuelles : 50 px en haut, 20 px à gauche et à droite, 50 px en bas. Je détaille comment ces marges se traduisent en mode téléphone : 20 px à gauche et à droite, 50 px en haut et en bas, ce qui crée un petit espace autour du contenu. Je modifie alors les marges du conteneur ciblé pour obtenir 20 px à gauche et à droite et 50 px en bas, afin que, en mode mobile, il reste une marge suffisante mais pas excessive. Je règle également un paramètre à 0 pour aligner exactement le même comportement que précédemment. Puis je propose une méthode plus rapide : copier le composant déjà configuré, le coller à l’endroit souhaité, effacer le bouton inutile et changer le texte. J’insiste sur le fait qu’il suffit de copier une section déjà bien paramétrée d’une page à l’autre pour reproduire le même résultat. Enfin, je publie les modifications, confirmant que le conteneur s’affiche correctement sur le site.