title: Cordova keyboard changes layout
body: <p>So I'm making my first Cordova app and I'm trying to create a simple login form. The thing is, when I click an input element, the keyboard pops up. For some reason this makes my whole layout change completely, while it isn't even close to being complicated. </p>
  
  <p>Anyone knows why this occurs?</p>
  
  <pre><code>&lt;html&gt;
  &lt;head&gt;
      &lt;!--
      Customize this policy to fit your own app's needs. For more guidance, see:
          https://github.com/apache/cordova-plugin-whitelist/blob/master/README.md#content-security-policy
      Some notes:
          * gap: is required only on iOS (when using UIWebView) and is needed for JS-&gt;native communication
          * https://ssl.gstatic.com is required only on Android and is needed for TalkBack to function properly
          * Disables use of inline scripts in order to mitigate risk of XSS vulnerabilities. To change this:
              * Enable inline JS: add 'unsafe-inline' to default-src
      --&gt;
      &lt;meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval'; style-src 'self' 'unsafe-inline'; media-src *; img-src 'self' data: content:; connect-src https://ikleeralles.nl:*"&gt;
      &lt;meta name="format-detection" content="telephone=no"&gt;
      &lt;meta name="msapplication-tap-highlight" content="no"&gt;
      &lt;meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, maximum-scale=1.0, target-densityDpi=device-dpi" /&gt;
      &lt;link rel="stylesheet" type="text/css" href="css/index.css"&gt;
      &lt;link rel="stylesheet" type="text/css" href="css/bootstrap.css"&gt;
      &lt;title&gt;Hello World&lt;/title&gt;
  &lt;/head&gt;
  &lt;body&gt;
      &lt;div class="app-screen"&gt;
              &lt;div id="result"&gt;&lt;/div&gt;
              &lt;form&gt;
                  &lt;label for="username"&gt;Gebruikersnaam:&lt;/label&gt;
                  &lt;input type="text" class="form-control" id="username"&gt;
                  &lt;label for="password"&gt;Wachtwoord:&lt;/label&gt;
                  &lt;input type="password" class="form-control" id="password"&gt;
                  &lt;button type="submit" id="submitForm" class="btn btn-default"&gt;Log in&lt;/button&gt;
              &lt;/form&gt;
      &lt;/div&gt;
      &lt;script type="text/javascript" src="cordova.js"&gt;&lt;/script&gt;
      &lt;script type="text/javascript" src="js/jquery.js"&gt;&lt;/script&gt;
      &lt;script type="text/javascript" src="js/post.js"&gt;&lt;/script&gt;
      &lt;script type="text/javascript" src="js/index.js"&gt;&lt;/script&gt;
  &lt;/body&gt;
  </code></pre>
  
  <p></p>
  
  <p>CSS:<a href="https://pastebin.com/vDSyqHSu" rel="nofollow noreferrer">https://pastebin.com/vDSyqHSu</a></p>
  
  <p><a href="https://i.stack.imgur.com/2gUwU.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/2gUwU.jpg" alt="Working well"></a></p>
  
  <p><a href="https://i.stack.imgur.com/GseDz.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/GseDz.jpg" alt="when keyboard shows"></a></p>