diff --git a/scss/_platform.scss b/scss/_platform.scss
index 70211243af..70e13ac20c 100644
--- a/scss/_platform.scss
+++ b/scss/_platform.scss
@@ -11,6 +11,16 @@
   // if its in Cordova, and set to fullscreen, then disregard the bump.
   &:not(.fullscreen) {
     margin-top: 20px;
+    /*
+     * Make header bar go under the status bar
+     */
+    .bar-header:not(.bar-subheader) {
+      top: -$ios7-statusbar-height;
+      height: $bar-height + $ios7-statusbar-height;
+      > * {
+        margin-top: $ios7-statusbar-height;
+      }
+    }
   }
   &.status-bar-hide {
     // Cordova doesn't adjust the body height correctly, this makes up for it
diff --git a/scss/_variables.scss b/scss/_variables.scss
index 948ea12c76..3e8dcb79d7 100644
--- a/scss/_variables.scss
+++ b/scss/_variables.scss
@@ -671,3 +671,7 @@ $z-index-slider-pager:            1 !default;
 $z-index-tabs:                    5 !default;
 $z-index-view:                    1 !default;
 
+// Platform
+// -------------------------------
+
+$ios7-statusbar-height:           20px !default;