title: How to make page full height on IOS9
body: <p>Rightblock is not fullheight on mobile devices. In bootsrap i removed responsive features, such as <code>col-md-*</code> replaced to <code>col-xs-*</code>
  On IOS8 devices everything is ok (via browserstack). Left block has <code>height:78vh</code>. How to make it simple fixed layout and disable scaling in safari browser</p>
  
  <pre class="lang-html prettyprint-override"><code>&lt;div class="wrapcontent"&gt;
  
    &lt;div class="container"&gt;
      &lt;div class="row"&gt;
        &lt;header id="header"&gt;&lt;/header&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  
    &lt;div id="content" class="content clearfix"&gt;
      &lt;div class="col-xs-12"&gt;
        &lt;div class="flex-container ng-scope"&gt;
          &lt;div class="col-xs-8 leftBlock"&gt;...&lt;/div&gt;
          &lt;div class="col-xs-4 rightBlock"&gt;...&lt;/div&gt;
        &lt;/div&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  
    &lt;div class="container"&gt;
      &lt;div class="row"&gt;
        &lt;footer id="footer" class="footer clearfix"&gt;&lt;/footer&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  
  &lt;/div&gt;
  </code></pre>
  
  <pre class="lang-css prettyprint-override"><code>.wrapContent {
    overflow: visible!important;
    height: auto!important;
    min-height: 100%;
    margin: 0 auto -71px;
    padding-bottom: 70px;
    background: #323742;
  }
  .header {
    overflow: visible;
    height: 189px;
  }
  .col-xs-12 {
    float: left;
  }
  .flex-container {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    overflow: hidden;
    margin-right: -15px;
  }
  .leftBlock {
    min-height: 78vh;
    float: left;
  }
  .rightBlock {
    position: relative;
    z-index: 1;
    padding: 0;
    border-left: 1px solid #e5e9ec;
    background: #f6f6fa;
  }
  </code></pre>
  
  
  
  <p><a href="https://i.stack.imgur.com/S1sFq.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/S1sFq.jpg" alt="enter image description here"></a> </p>