Make WordPress Core

Opened 3 years ago

Closed 3 years ago

Last modified 3 years ago

#49463 closed defect (bug) (invalid)

Beta 5.4 HTML position:fixed

Reported by: andre-jutras's profile Andre Jutras Owned by:
Milestone: Priority: normal
Severity: normal Version: 5.4
Component: Editor Keywords: needs-patch
Focuses: css Cc:

Description

I'm testing out beta 5.4 and noticed an odd issue relating to the HTML tag in a page where in mobile, the browser scrollbar disappears due to this CSS:

Found here:

/wp-includes/css/dist/block-editor/style.min.css?ver=5.4-beta1
html {
    position: fixed;
    width: 100%;
}

For screens larger than 782px:

@media (min-width: 782px)
html {
    position: static;
    width: auto;
}

I checked current 5.3 version and this is nowhere to be seen. What is the purpose of the fixed HTML in mobile screens below 782px? I'm assuming this is a bug.

Change History (4)

#1 @SergeyBiryukov
3 years ago

  • Component changed from General to Editor
  • Version set to trunk

This ticket was mentioned in Slack in #core-css by ryelle. View the logs.


3 years ago

#3 @ryelle
3 years ago

  • Milestone Awaiting Review deleted
  • Resolution set to invalid
  • Status changed from new to closed

Hi @andre-jutras!

Are you still seeing this issue? I noticed the code has changed since this report, and it seems to work fine on my phone.

If this is still a problem, can you create an issue in the Gutenberg repository? That's the source of this code. Thanks!

#4 @sabernhardt
3 years ago

Thanks @andre-jutras for the report and @ryelle for responding more quickly than I did :)

For history, the fixed positioning was purposely added for mobile in pull request 18686.

A comment in the current stylesheet file briefly explains the reasoning:

// On Mobile devices, swiping the HTML element should not scroll.
// By making it fixed, we prevent that.
html.interface-interface-skeleton__html-container {
	position: fixed;
	width: 100%;
Note: See TracTickets for help on using tickets.