diff --git a/resources/static/dialog/css/popup.css b/resources/static/dialog/css/popup.css index 4d456ea6718a94ede2032010cf41faa37779c234..d8f0f3d106fda54b8789d902f0cd25f31914c863 100644 --- a/resources/static/dialog/css/popup.css +++ b/resources/static/dialog/css/popup.css @@ -302,6 +302,16 @@ div#required_email { #selectEmail.center { position: static; overflow-y: visible; + /* The below 1px padding is part of a fix for a bug in webkit where there + * is a ghost padding-right to accommodate the scroll bar that is shown + * if there are many email addresses. The ghost padding caused the submit + * button to shift when the user clicked on it, sometimes making the + * submit button require two clicks. The other half of the fix is in + * screen_size_hacks.js, where an adjustment to the width is made. + * These two in combination force Chrome to re-flow, which fixes its + * own bug. + */ + padding-right: 1px; } .inputs { diff --git a/resources/static/dialog/resources/screen_size_hacks.js b/resources/static/dialog/resources/screen_size_hacks.js index 0d48fa3d97bfa0cacb7821ea442673dc46f00f9e..66b14865f1b5a83d557277de7f155201b83861f0 100644 --- a/resources/static/dialog/resources/screen_size_hacks.js +++ b/resources/static/dialog/resources/screen_size_hacks.js @@ -30,6 +30,18 @@ if(height < $("#signIn .vertical").innerHeight()) { selectEmailEl.addClass("center"); + + /* The below width adjustment is part of a fix for a bug in webkit where + * there is a ghost padding-right to accommodate the scroll bar that is + * shown if there are many email addresses. The ghost padding caused the + * submit button to shift when the user clicked on it, sometimes making + * the submit button require two clicks. The other half of the fix is + * in popup.css, where an adjustment to the padding is made. + * These two in combination force Chrome to re-flow, which fixes its + * own bug. + */ + var width = selectEmailEl.width(); + selectEmailEl.width(width); } else { selectEmailEl.removeClass("center");