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

Popular posts from this blog

javascript - Clear button on addentry page doesn't work -

c# - Selenium Authentication Popup preventing driver close or quit -

tensorflow when input_data MNIST_data , zlib.error: Error -3 while decompressing: invalid block type -