diff --git a/browser/metro/base/content/ContentAreaObserver.js b/browser/metro/base/content/ContentAreaObserver.js
index d7e430f425f..9ba7b0a1597 100644
--- a/browser/metro/base/content/ContentAreaObserver.js
+++ b/browser/metro/base/content/ContentAreaObserver.js
@@ -117,8 +117,9 @@ var ContentAreaObserver = {
     let newWidth = width || this.width;
     let newHeight = height || this.height;
 
-    if (newHeight == oldHeight && newWidth == oldWidth)
+    if (newHeight == oldHeight && newWidth == oldWidth) {
       return;
+    }
 
     this.styles["window-width"].width = newWidth + "px";
     this.styles["window-width"].maxWidth = newWidth + "px";
@@ -132,28 +133,15 @@ var ContentAreaObserver = {
   },
 
   updateContentArea: function cao_updateContentArea (width, height) {
-    if (Browser.selectedBrowser) {
-      let notificationBox = Browser.getNotificationBox();
-
-      // If a notification and navbar are visible together,
-      // make the notification appear above the navbar.
-      if (ContextUI.navbarVisible && !notificationBox.notificationsHidden &&
-          notificationBox.allNotifications.length != 0) {
-        let navbarHeight = Elements.navbar.getBoundingClientRect().height;
-        notificationBox.style.paddingBottom = navbarHeight + "px";
-      } else {
-        notificationBox.style.paddingBottom = "";
-      }
-    }
-
     let oldHeight = parseInt(this.styles["content-height"].height);
     let oldWidth = parseInt(this.styles["content-width"].width);
 
     let newWidth = width || this.width;
     let newHeight = height || this.contentHeight;
 
-    if (newHeight == oldHeight && newWidth == oldWidth)
+    if (newHeight == oldHeight && newWidth == oldWidth) {
       return;
+    }
 
     this.styles["content-height"].height = newHeight + "px";
     this.styles["content-height"].maxHeight = newHeight + "px";
@@ -171,8 +159,9 @@ var ContentAreaObserver = {
     let newWidth = width || this.width;
     let newHeight = height || this.viewableHeight;
 
-    if (newHeight == oldHeight && newWidth == oldWidth)
+    if (newHeight == oldHeight && newWidth == oldWidth) {
       return;
+    }
 
     this.styles["viewable-height"].height = newHeight + "px";
     this.styles["viewable-height"].maxHeight = newHeight + "px";
diff --git a/browser/metro/base/content/ContextUI.js b/browser/metro/base/content/ContextUI.js
index fcb4fde6f24..547f5106363 100644
--- a/browser/metro/base/content/ContextUI.js
+++ b/browser/metro/base/content/ContextUI.js
@@ -175,6 +175,7 @@ var ContextUI = {
   // Display the nav bar
   displayNavbar: function () {
     Elements.navbar.show();
+    Elements.chromeState.setAttribute("navbar", "visible");
     ContentAreaObserver.updateContentArea();
   },
 
@@ -189,6 +190,7 @@ var ContextUI = {
     if (!BrowserUI.isStartTabVisible) {
       Elements.autocomplete.closePopup();
       Elements.navbar.dismiss();
+      Elements.chromeState.removeAttribute("navbar");
       ContentAreaObserver.updateContentArea();
     }
   },
diff --git a/browser/metro/base/content/browser-ui.js b/browser/metro/base/content/browser-ui.js
index 31e65574a13..35bc704e797 100644
--- a/browser/metro/base/content/browser-ui.js
+++ b/browser/metro/base/content/browser-ui.js
@@ -32,6 +32,7 @@ let Elements = {};
   ["urlbarState",        "bcast_urlbarState"],
   ["loadingState",       "bcast_loadingState"],
   ["windowState",        "bcast_windowState"],
+  ["chromeState",        "bcast_chromeState"],
   ["mainKeyset",         "mainKeyset"],
   ["stack",              "stack"],
   ["tabList",            "tabs"],
diff --git a/browser/metro/base/content/browser.xul b/browser/metro/base/content/browser.xul
index b6b97e7b288..7f7e5fafc52 100644
--- a/browser/metro/base/content/browser.xul
+++ b/browser/metro/base/content/browser.xul
@@ -69,6 +69,8 @@
                  viewstate=""/>
     <broadcaster id="bcast_loadingState"
                  loading="false"/>
+    <broadcaster id="bcast_chromeState"
+                 navbar="visible"/>
   </broadcasterset>
 
   <observerset id="observerset">
@@ -399,6 +401,8 @@ Desktop browser's sync prefs.
       <stack id="content-viewport">
         <observes element="bcast_windowState"
                   attribute="startpage"/>
+        <observes element="bcast_chromeState"
+                  attribute="navbar"/>
         <deck id="browsers"
               flex="1"
               observes="bcast_preciseInput"/>
diff --git a/browser/metro/theme/browser.css b/browser/metro/theme/browser.css
index 9e957133b23..f892d6ce021 100644
--- a/browser/metro/theme/browser.css
+++ b/browser/metro/theme/browser.css
@@ -251,10 +251,6 @@ documenttab[selected] .documenttab-selection:-moz-locale-dir(rtl) {
 
 /* Start UI ----------------------------------------------------------------- */
 
-#content-viewport[startpage] .active-tab-notificationbox {
-  padding-bottom: @toolbar_height@;
-}
-
 #urlbar-autocomplete[viewstate="snapped"],
 #urlbar-autocomplete[viewstate="portrait"]{
   -moz-box-orient: vertical;
@@ -505,6 +501,11 @@ documenttab[selected] .documenttab-selection:-moz-locale-dir(rtl) {
   visibility: hidden;
 }
 
+#content-viewport[navbar="visible"] .active-tab-notificationbox:not([count="0"]):not([notificationsVisible="false"]) {
+  padding-bottom: @toolbar_height@;
+}
+
+
 /* Progress meter ---------------------------------------------------------- */
 
 #progress-container {