diff --git a/src/css/style.less b/src/css/style.less
index 201309b9..6e37e50a 100644
--- a/src/css/style.less
+++ b/src/css/style.less
@@ -756,6 +756,17 @@ input[type='radio'].nice-radio {
             & + .alert {margin-top: 0;}
         }
 
+    }
+
+    #flashMessageButtons {
+        position: fixed;
+        top: 0;
+        left: 0;
+        right: 0;
+        z-index: 2002; // above pacman and flashMessage
+        max-height: 30px;
+        width: 41px;
+
         button {
             .btn-xs;
             .btn-link;
diff --git a/src/index.html b/src/index.html
index 4d032f17..dbaf3ec3 100644
--- a/src/index.html
+++ b/src/index.html
@@ -32,13 +32,15 @@
         </header>
 
         <div id="flashMessage">
+            <div class="messages"></div>
+        </div>
+        <div id="flashMessageButtons">
             <button id="toggle-btn" data-y18n-title="pin">
                 <span class="sr-only">Pin&nbsp;</span><span class="fa-thumb-tack"></span>
             </button>
             <button id="clear-btn" data-y18n-title="clear">
                 <span class="sr-only">Clear&nbsp;</span><span class="fa-trash-o"></span>
             </button>
-            <div class="messages"></div>
         </div>
 
         <div id="slider-container">