css ile video galerisine sabit boyut verme nasıl yapılır

[mali2012]

Merhabalar. Yaptığım siteye bir video slaytı koydum. Slayt'da sadece html kodları var. Vidyonun biri "400px" yüksekliğinde bir diğeri "500px". Slayt ile vidyodan vidyoya geçerken boyut farkından dolayı oynamalar oluyor. "max-height" ile de sorunu çözemedim. Ne yapmam gerekli, bir bileninz var mı, arkadaşlar?

 

[Samet UCA]

div içerisindemi bu videolar?

 

[mali2012]

<div class="carousel-item active" style="max-height: 500px;">
<video controls>
<source src="videos/video-1.mp4" type="video/mp4">
</video>
</div>


şeklinde yaptım.

 

[Samet UCA]

Kodu şu şekilde düzenle

<div class="carousel-item active" style="max-height: 500px;">
<video controls> 
<main>
  <iframe width="560" height="315" src="VideoYolu" frameborder="0"
    allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</main>
</video>
</div>

CSS kodlarının bulunduğu dosyayada şunları yaz

video,
iframe {
  width: 100% !important;
  height: auto !important;
}

main {
  background: white;
  height: 100vh;
  max-width: 400px;
  margin: 0 auto;
  padding: 1rem;
}

 

[mali2012]

Bu şekilde çıktı sonuç. Next ile ilerliyor ama video çıkmıyor. Arkaplannı mavi yapmıştım, renge takılma.
Bu arada " allow="accelerometer; encrypted-media; gyroscope; " ben bunların internetten ne olduğunu bulamadım. Bu kodlar ne işe yarıyor?