Fix sticky header on mobile by using overflow-x: clip instead of hidden
overflow-x: hidden on body creates a scroll container that breaks position: sticky. overflow-x: clip prevents horizontal overflow without affecting the sticky context. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -92,9 +92,9 @@
|
|||||||
PHONE (≤ 600px)
|
PHONE (≤ 600px)
|
||||||
================================================================ */
|
================================================================ */
|
||||||
@media (max-width: 600px) {
|
@media (max-width: 600px) {
|
||||||
/* Prevent horizontal scroll */
|
/* Prevent horizontal scroll (clip instead of hidden to preserve sticky) */
|
||||||
html, body {
|
html, body {
|
||||||
overflow-x: hidden;
|
overflow-x: clip;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* ── Header ── */
|
/* ── Header ── */
|
||||||
|
|||||||
Reference in New Issue
Block a user