title: jQuery Mobile .ui-page min-height is large
body: <p>i build html\css app using phonegap
  the jury mobile give me the div:</p>
  
  <pre><code>&lt;div data-role="page" data-url="/Users/tzahianidgar/Desktop/My Project/NaughtyLittleTurtles/Code/NLT/www/MainScreenIndex.html" tabindex="0" class="ui-page ui-page-theme-a ui-page-active" style="min-height: 736px;"&gt;
  </code></pre>
  
  <p>and the min-height is too large in emulator i see black line in bottom
  like this:</p>
  
  <p><a href="https://i.stack.imgur.com/PtyQO.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/PtyQO.png" alt="the black line"></a></p>
  
  <p>if i change the min-height: 736px in the css file it's work but after refresh it's back to min-height: 736px</p>
  
  <p>this what happened after i add:
      <code>.ui-page-active {min-height:100vh; -webkit-background-size: cover; -moz-background-size: cover;  -o-background-size: cover; background-size:</code> cover;}</p>
  
  <p>the image:
  <a href="https://i.stack.imgur.com/lzFie.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/lzFie.png" alt="the code after i change"></a></p>