diff --git a/resources/static/dialog/css/m.css b/resources/static/dialog/css/m.css
index 2a757809b174111c8050bdb28fcc7a5a5cd8d9cf..666f1d147a8c1461fb79309dd5f9971db681ff1d 100644
--- a/resources/static/dialog/css/m.css
+++ b/resources/static/dialog/css/m.css
@@ -2,6 +2,9 @@
  * License, v. 2.0. If a copy of the MPL was not distributed with this
  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
 
+/* If the max-width changes, the size given in screen_size_hacks.js must be
+ * updated as well.
+ */
 @media screen and (max-width: 640px) {
 
   header, footer {
diff --git a/resources/static/dialog/resources/screen_size_hacks.js b/resources/static/dialog/resources/screen_size_hacks.js
index 33685cb756f36123246e781af5600ff6b586e4c8..5918d5008dee959da6b6dfd19866e8fd4cf18250 100644
--- a/resources/static/dialog/resources/screen_size_hacks.js
+++ b/resources/static/dialog/resources/screen_size_hacks.js
@@ -12,7 +12,10 @@
         signInEl = $("#signIn");
 
     selectEmailEl.css("position", "static");
-    if($(window).width() >= 640) {
+
+    // The mobile breakpoint is 640px in the CSS.  If the max-width is changed
+    // there, it must be changed here as well.
+    if($(window).width() > 640) {
       // First, remove the mobile hacks
       selectEmailEl.css("width", "");
       contentEl.css("min-height", "");