title: Ionic iframe loading not fully working on iOS
body: <p>I´m working on a mobile app using ionic. The app has multiple iframes where external pages are loaded. The iframe loading is working fine on android (devices and emulator) and in the browser. But on iOS the external page is not fully loaded in the iframe. The page is cut off at the buttom of the page see the screenshot for Details:
  <a href="http://i.stack.imgur.com/TQRTj.png" rel="nofollow">iOS Device Screen</a> </p>
  
  <p>My Questions is why is this happening and why it is working on android.
  The following code-snippet shows how i am adding the iframe:</p>
  
  <p><strong>page.html</strong></p>
  
  <pre><code>&lt;ion-view  class="center" view-title=""&gt;          
  &lt;ion-content&gt;
  &lt;!-- div used to enable scrolling in the iframe on iOS --&gt;
  &lt;div class="scroll-wrapper"&gt;
     &lt;iframe id="seats" width ="100%" height ="100%" ng-src="  {{seatPath}}" ng-onload="hideProgess()" ng-show="!loadError" &gt;&lt;/iframe&gt;
  &lt;/div&gt;
  &lt;/ion-content&gt;
  </code></pre>
  
  <p></p>
  
  <p><strong>main.css</strong></p>
  
  <pre><code>  .center .scroll-content {
    display: table !important;
    width: 100% !important;
    height: 100% !important;
    text-align: center;
  }
  .center .scroll {
    display: table-cell !important;
    vertical-align: middle !important;
  }
  
  .scroll-wrapper {
    position: fixed; 
    right: 0; 
    bottom: 50px; 
    left: 0;
    top: 0;
    -webkit-overflow-scrolling: touch;
    overflow-y: scroll;
  }
  
  .scroll-wrapper iframe {
    height: 100% !important;
    width:  100% !important;
    min-height: 100% !important;
    bottom: 50px !important;; 
  }
  </code></pre>
  
  <p><strong>EDIT:</strong><br>
  I have tested other webpages and the are working when i load them into the iframe even on ios is possible that there is a bug with the webpage i want to load?</p>