Chrome 129 CSS grid stack bugs?
I've got an image carousel built with CSS grid areas to stack elements on top of each other, which has been working great for ages. In Chrome 129, the image carousel seems to be getting focus through menus rendered over it. Chromium 128-based browsers and Firefox have no issue. Is anyone else seeing weirdness in this direction on Chrome 129?
2 Replies
Huh. It's a change to how z-index is handled, apparently. My menu dropdown is position: absolute and z-index: 1000, and it turns out that something in the image carousel was also z-index: 1000. That used to cause no issues, but apparently in modern chrome the later element in the page with a given z-index will always get :hover and click events, regardless of which is rendered above the other. Good work, Google...
When I remove z-index from all the elements, it renders exactly the same (z-index on the carousel was an artifact of an earlier strategy). Menus are rendered above just as they should be given position: absolute and all, but without a high z-index on the menu element, they never get focus over the stacked grid thing. They do get focus over the regular div right next to it, though...
G