Can't scroll iframe Responsive Sharepoint 2016 on mobile iOS Safari

Question

I used bootstrap to make iframe responsive .iframe is a magazine that contains several pages. My problem is: I can scroll only one page in the iframe on IOS.

    <div id="outerdiv" class="embed-responsive embed-responsive-16by9"   style="-webkit-overflow-scrolling: touch !important; overflow: auto!important;">

<asp2:HtmlIframe src="#"  runat="server"class="embed-responsive-item"  id="frame" allowfullscreen></asp2:HtmlIframe>
        </div>

Answer 1

Try this:

 #s4-workspace, iframe {
    overflow: scroll !important;
    width: 100%;
    height: 100%;
    border: none;
}
.div {
    overflow: hidden;
    width: 100%;
    height: 100%;
    border: none;
    background-color: #FFF;
}