initClub · 1ère Communauté Webflow Francophone

Updated last month

Difficulty Centering Video on Webpage

At a glance

Salut tout le monde !
J’ai un petit pbm sur ce site : https://www.tamias.com/fr
Je n’arrive pas à caler ma vidéo (qui actuellement a un margin top négatif) en fonction des tailles d’écrans)
Soit la vidéo passe au dessus du texte, soit j’ai un énorme espace...

ça me rend dingue, surtout que pour mieux gérer la chose je me suis dis que j’allais ajouter des breakpoint en plus, mais au final je pense que je me suis tirée une balle dans le pied 😞

Merci tout le monde !

N
C
T
7 comments

Hello @Caroline Teulery, tu as un lien de preview ?

Hello Caroline, as-tu une capture d’écran de la maquette afin que nous ayons une idée du rendu souhaité ?

Voilà le rendu souhaité !
Mais je pense que j’ai trouvé le pbm.
en fait j’avais le bug sur la version VF où le titre passait sur 3 lignes au lieu de 2, et comme la hauteur de mon header est en vh, je pense que ça cassait un peu tout ça.

Tu peux effectivement spécifier une min-height en VH plutôt qu’une height fixe en VH. Tu peux également prévoir un padding-bottom en bas de ton hero pour protéger la zone et éviter que ton texte se retrouve sous la vidéo 😉

J’ai fait ça, mais alors quand je demande aux autres de me dire ce qu’ils voient, c’est la cata ><
Pour voir si c’est mieux, j’ai :

  • passé tout mon bloc vidéo en absolute (au lieu d’utiliser les marges négatives)
  • ajouté des div de “sécurité” pour que la vidéo ne chevauche pas le texte.

Mais c’est toujours pas optimisé...

Add a reply
Sign up and join the conversation on Slack