diff --git a/app/assets/javascripts/stick-to-window-when-scrolling.js b/app/assets/javascripts/stick-to-window-when-scrolling.js index 4429ca026..c81e887c2 100644 --- a/app/assets/javascripts/stick-to-window-when-scrolling.js +++ b/app/assets/javascripts/stick-to-window-when-scrolling.js @@ -1024,10 +1024,14 @@ $el.css({ // element will be absolutely positioned so cannot rely on parent element for width width: window.innerWidth + "px", + // padding-left must align the sticky element's content with the main content area. + // The element has CSS margin-left: -gutterHalf which, combined with left: 0 in fixed + // positioning, shifts the border-box 15px to the left of the viewport edge. + // We compensate by using the main element's actual left offset from the viewport + // (via getBoundingClientRect) plus twice the padding to account for both the + // main's own left padding and the element's negative margin offset. "padding-left": - (window.innerWidth - (main.offsetWidth - mainPaddingLeft)) / 2 + - mainPaddingLeft + - "px", + main.getBoundingClientRect().left + 2 * mainPaddingLeft + "px", }); }; stickAtBottom.stick = function (el) { diff --git a/app/templates/views/choose-account.html b/app/templates/views/choose-account.html index 5edf95121..ce96b7c96 100644 --- a/app/templates/views/choose-account.html +++ b/app/templates/views/choose-account.html @@ -108,10 +108,7 @@