title: Ionic bar-header overlap with ion-content
body: <p>I'm trying to add bar-header and form-input. But the username form doesn't appear, probably because it's overlapping with the bar-header. I've added class="has-header" in ion-content but this doesn't work and the username form and the bar-header still overlap eachother. Can anyone help me out?</p>
  
  <p>This is my code:</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html ng-app="myApp"&gt;
    &lt;head&gt;
      &lt;meta charset="utf-8"&gt;
      &lt;meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width"&gt;
      &lt;title&gt;&lt;/title&gt;
  
      &lt;link href="lib/ionic/css/ionic.css" rel="stylesheet"&gt;
      &lt;link href="css/style.css" rel="stylesheet"&gt;
  
      &lt;!-- IF using Sass (run gulp sass first), then uncomment below and remove the CSS includes above
      &lt;link href="css/ionic.app.css" rel="stylesheet"&gt;
      --&gt;
  
      &lt;!-- ionic/angularjs js --&gt;
      &lt;script src="lib/ionic/js/ionic.bundle.js"&gt;&lt;/script&gt;
  
      &lt;!-- cordova script (this will be a 404 during development) --&gt;
      &lt;script src="cordova.js"&gt;&lt;/script&gt;
  
      &lt;!-- your app's js --&gt;
      &lt;script src="js/app.js"&gt;&lt;/script&gt;
      &lt;script src="js/controllers.js"&gt;&lt;/script&gt;
      &lt;script src="js/services.js"&gt;&lt;/script&gt;
    &lt;/head&gt;
    &lt;body&gt;
      &lt;div class="bar bar-header bar-calm"&gt;
                  &lt;h1 class="title"&gt;bar-calm&lt;/h1&gt;
      &lt;/div&gt;
      &lt;ion-content class="has-header"&gt;
      &lt;div class="list"&gt;          
          &lt;label class="item item-input"&gt;
              &lt;span class="input-label"&gt;Username&lt;/span&gt;
              &lt;input type="text"&gt;
          &lt;/label&gt;
          &lt;label class="item item-input"&gt;
              &lt;span class="input-label"&gt;Password&lt;/span&gt;
              &lt;input type="password"&gt;
          &lt;/label&gt;
          &lt;label class="item item-input"&gt;
              &lt;span class="input-label"&gt;Username&lt;/span&gt;
              &lt;input type="text"&gt;
          &lt;/label&gt;
          &lt;label class="item item-input"&gt;
              &lt;span class="input-label"&gt;Password&lt;/span&gt;
              &lt;input type="password"&gt;
          &lt;/label&gt;
       &lt;/div&gt;
       &lt;/ion-content&gt;
       &lt;div class="bar bar-footer bar-calm"&gt;
          &lt;div class="title"&gt;Footer&lt;/div&gt;
       &lt;/div&gt;`enter code here`
    &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>