79639738

Date: 2025-05-27 02:19:35
Score: 1.5
Natty:
Report link

Problem I'm encountering an issue in Chrome on Mac (Apple Silicon) where the cursor: pointer does not appear over certain clickable components when the browser is in fullscreen mode and zoomed in (via Cmd+ or increased font size in settings). However, the onClick handlers still work, meaning the element is functional — just missing the pointer cursor.

When It Happens Only in Chrome (latest version)

Only on Mac ARM (M1/M2)

Only in fullscreen mode with scaling/zoom applied

Works fine in:

Windowed Chrome (even when zoomed)

Safari and Firefox

All other components except the topmost stacked one

Tech Stack React with CSS Modules

CSS Reset using modern-normalize v3.0.1 with custom overrides

Using @layer in CSS

Absolute positioning used to stack components

What I’ve Tried Verified cursor: pointer is applied (including !important) in all relevant CSS rules

onClick still fires correctly

Removed CSS reset — no change

Added multiple components in the same location — only the topmost one shows the issue

Confirmed the bug disappears when:

Exiting fullscreen

Resetting browser zoom to 100%

Reasons:
  • Long answer (-1):
  • No code block (0.5):
  • User mentioned (1): @layer
  • Low reputation (1):
Posted by: Mohtasem Jahan Siddique