Fixed header not fixed when there is horizontal overflow

Question

I have a header with a fixed position and a width of 100%. It's working as expected on desktop, but not in mobile browsers (Chrome, Opera and Edge). I'm testing on Android 5.1 if that makes a difference.

When there is horizontal overflow, the header is no longer fixed.

bur · Accepted Answer · 2018-03-12 08:03:20Z

2

I fixed it by setting overflow: auto on both html and body.

EDIT: doing that makes the header go over the scrollbar. The actual fix is adding user-scalable=no to <meta content='width=device-width,initial-scale=1' name='viewport'>

See this answer

edited Mar 12, 2018 at 8:03

answered Mar 11, 2018 at 1:39

bur

8998 silver badges22 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Fixed header not fixed when there is horizontal overflow

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related