Vertical overflow

[krzysztofjeziorny]

Description

Setting css of a .container (in the site footer) and .dashboard .dashboard-navbar to 100vw causes a vertical overflow in Firefox (v112).

On Chrome(ium) it is mitigated with overflow: overlay, but it isn't supported on Firefox yet.

On the demo site it is visible when creating a repo https://try.gitea.io/repo/create

Propsed change: removing the set width of 100vw on these classes eliminates the need of hacking the vertical overflow on the body (with overflow-x: hidden;).

Screenshots

Gitea Version

1.19.1

Can you reproduce the bug on the Gitea demo site?

Yes

Operating System

MacOS 12.6.5

Browser Version

112

[silverwind]

I do not see any scrollbars in https://try.gitea.io/repo/create with Firefox 112 on MacOS. What's your version/os?

[krzysztofjeziorny]

Operating System

MacOS 12.6.5

Browser Version

112

Also in Firefox Developer Edition, 113.0b4, without extensions.

[krzysztofjeziorny]

Just had a thought: as it doesn't happen on my Debian/KDE Firefox installation, where the scrollbars are kind-of-nonexistent, I'll check that out:

And sure enough, when scrollbars are automatic, the layout is all right. When set to "Always", the overflow bug is now visible.

Should I create a PR with a layout fix?

[silverwind]

Ah, yes I see it as well with "always" scrollbars. Please open a PR so we can test/discuss further.

[krzysztofjeziorny]

@silverwind Pushed. Thanks for taking a look at it!

[wxiaoguang]

Closed by #24184