Hallo,
ich habe einen HTML Code für ein Video in ein div> gepackt und im Widget CSS ebenfalls Einstellungen vorgenommen. Trotzdem geht das Video in der Breite in der Mobilen Ansicht über die Breite hinaus und ist nicht vollständig erkennbar.
Ich arbeite mit Wordpress LandingPages by PluginOps.
Habe ein HTML Widget eingefügt mit diesem Code (für Lesbarkeit habe ich Leerzeichen zwischen den Klammern gesetzt, die natürlich nicht vorhanden sind)
< div class=„video-container-wrapper“ >< div class=„video-container“ style=„text-align: center;“ >< iframe width=„480“ height=„270“ src=„https://www. powtoon.com/embed/ xxxxxxxx/“ frameborder=„0“ allowfullscreen > < /iframe> < /div > < /div >
Und unter Advanced Settings im Widget CSS steht:
/*.video-container {
position: relative;
padding-bottom: 56.25%;
padding-top: 0;
height: 0;
overflow: hidden;
}
.video-container iframe,
.video-container object,
.video-container embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.video-container-wrapper {
max-width: 100%;
width: 500px;
left: 0;
right:0;
margin:auto;
}*/
Was muss ich ändern, damit auf mobil-Geräten das Video voll im Bildschirm angezeigt wird? Ich habe das Internet bereits durchforscht und unterschiedliche Code-Schnipsel ausprobiert, es hat nirgendwo wirklich hingehauen.
Danke für eure Unterstützung!