Comment avez-vous centre une vidéo à l'aide de CSS

Je suis en train de centre une vidéo dans mon site, mais je ne veux pas utiliser le centre de balises en HTML car il est un peu obsolète. Comment puis-je le faire avec du CSS? Voici mon code HTML si ça aide.

<center>
  <video width="320" height="240" controls>
    <source src="video.mp4" type="video/mp4">
    <source src="video.ogg" type="video/ogg">
    <source src="video.webm" type="video/webm">
    Your browser does not support the video tag.
  </video>
</center>
Genre obsolète? Très obsolète! Selon la façon dont la page est marqué, vous pouvez ajuster les marges de gauche en tant que auto. Par exemple, video { margin: 0 auto; }

OriginalL'auteur Rhiannon | 2013-07-07

  1. 14

    Voici un exemple: http://jsfiddle.net/Cn7SU/

    Juste ajouter ces règles CSS de l'élément video:

    display: block;
margin: 0 auto;

    Ajouter le display: block propriété est très importante. Sinon, vous ne pouvez pas le centre de l'élément.

    OriginalL'auteur leoMestizo

  2. 2

    Au centre de la vidéo horizontalement ajouter:

    display: block;
margin: 0 auto;

    OriginalL'auteur Kerim

  3. 1

    Essayer cette, avoir un div wrapper autour de votre balise vidéo. les vidéos html5 et les images sont traités comme du texte quand à la coiffure. Ainsi, un text-align:center fonctionne. Vous pouvez vérifier le violon ci-dessous.

    <div class="video">  
  <video width="320" height="240" controls>
    <source src="video.mp4" type="video/mp4">
    <source src="video.ogg" type="video/ogg">
    <source src="video.webm" type="video/webm">
    Your browser does not support the video tag.
  </video>
</div>
    exemple jsfiddle.net/DgTWb
    M'a aidé, en effet, pour un intégré à une vidéo YouTube. Merci. 🙂

    OriginalL'auteur user760226