0

NOTE: the suggested answer has nothing to do with my question and DOES NOT answer my question. if you are looking for real, quality answer please see:

Unfortunately, most mods/people who vote don't even read the post, they just want to hit "the quota".

Original question:

I know one of the requirements in order for position: sticky to work is parent shouldn't have overflow property (hidden/auto). but why if a parent has overflow-x: hidden|auto it also breaks sticky? (which scrolls on Y-axis) please see the codepen.io

  overflow-x: auto;  // won't work
  overflow-x: visible;  // works
  overflow-x: hidden;  // won't work

is there a way to make overflow-x: hidden and position: sticky work together? Note: the scroll element need to be window, not an internal dive

https://codepen.io/kossel/pen/GRXKLep

Yichz
  • 9,250
  • 10
  • 54
  • 92
  • If you apply `overflow-x: auto;` or `overflow-x: hidden;` only to `body` (instead of `html, body`), then I see no problem in the codepen – Ivan Beliakov Feb 13 '23 at 20:53
  • yeah, that too, wondering why in general overflow-X would affect it, and even worse why only if I set both HTML and body would break lol – Yichz Feb 13 '23 at 20:55
  • Take a look at this comment https://stackoverflow.com/a/54116725/13304024 – Ivan Beliakov Feb 13 '23 at 20:55
  • the suggested answer has nothing to do with my question and DOES NOT answer my question. stackoverflow.com/a/54116725/13304024 does – Yichz Feb 13 '23 at 21:41

0 Answers0