Reputation: 1
Apologies if this has been asked before, I found similar but not exactly what I'm looking for.
I've found various online tools to embed a responsive Youtube video, however in doing so, it makes them huge on desktop (as it's set to 100% I think and taking up the whole screen).
I found a piece of code that apparently fixes this problem here https://forum.freecodecamp.org/t/help-resizing-embed-youtube-video-with-css/210568 but am unsure where that code fits into what I have so far (i'm a complete novice with code).
Would someone be able to help and provide me with the full piece of code I will need (I only have access to the HTML), so that I can just slot in the youtube link?)
Thanks in advance!
Upvotes: 0
Views: 2113
Reputation: 1070
You can make a YouTube Embed responsive with min
and max
width and height mentioned in the CSS. You can edit the code as per your needs and I do not know why Stack Overflow is not running the code, you can save it and run it manually.
As:
<iframe class="yt" src="https://www.youtube.com/embed/668nUCeBHyY" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
<style>
.yt{
width: 100%;
min-width:200;
max-width:800;
height: auto;
min-height:400;
}
</style>
Upvotes: 3