Embed video
Aspect ratio is perfect for responsively handling video or slideshow embeds based on the width of the parent.
Responsive Video
Wrap any embed, like an iframe, in a parent element with add aspect ratio classes. The immediate child element is automatically sized. Combine the .aspect-w-{n}
and .aspect-h-{n}
classes to specify the aspect ratio for an element:
<div class="aspect-w-16 aspect-h-9">
<iframe src="https://www.youtube.com/embed/VIDEOID" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
For more information about this tailwind plugins please read documentaion in here