Moin,
wer den IE nicht mehr unterstützen muss, kann auch aspect-ratio verwenden. 2 weitere Zeilen begrenzen die maximale Breite des Players und zentrieren ihn horizontal.
Code:
.video_container {
position: relative;
aspect-ratio: 16 / 9;
width: min(100vw, 40rem); /* limit the player width to 40rem */
margin-inline: auto; /* horizontal centering */
}
.video_container iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
Browserunterstützung aspect-ratio: https://caniuse.com/mdn-css_properties_aspect-ratio
Browserunterstützung margin-inline: https://caniuse.com/mdn-css_properties_margin-inline
Browserunterstützung min(): https://caniuse.com/css-math-functions
Gruß
Mathias
Lesezeichen