html - Responsive iframes for mobile phones -
so, i'm having quite bit of problem in making iframes work in mobile devices. it's covering half or more of screen. suspect because of lines of css put in iframes.
.wrapper2 { position: relative; padding-bottom: 56.25%; /* 16:9 */ padding-top: 25px; height: 0; } .wrapper2 iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
i add text, using viewport sizing(vw, vh, vmin, vmax) if of getting problems long blocks of texts producing scrollbars. think (???) may have iframe css and/or text sizing. necessary change need implement? thank in advance!
please post html make easier understand problem is.
try -- if iframe in html you'll find :
<iframe width="560" height="315" src="https://www.youtube.com/embed/hdi9inno86u" frameborder="0" allowfullscreen></iframe>
so, there's width & height defined inside iframe element. have change width="100%"
;
Comments
Post a Comment