New issue
Advanced search Search tips

Issue 884397 link

Starred by 2 users

Issue metadata

Status: WontFix
Owner: ----
Closed: Sep 17
Cc:
Components:
EstimatedDays: ----
NextAction: ----
OS: ----
Pri: 3
Type: Bug



Sign in to add a comment

New behavior for 'contain' css style differs from other browsers. Breaks some functionality of webpage

Project Member Reported by crumley@google.com, Sep 14

Issue description

Chrome Version       : 70.0.3538.16 (Official Build) beta (64-bit)
URL : contacts.google.com
Behavior in Chrome 69: red/pink FAB stays fixed position relative to page
Behavior in Firefox 3.x/4.x:red/pink FAB stays fixed position relative to page
 
What steps will reproduce the problem?
(1) Go to contacts.google.com
(2) Scroll down your contacts list
(3) Notice that the pink FAB button for creating a contact (bottom right) scrolls with you now. It is supposed to stay fixed (and has position:fixed applied)

It appears that the latest update makes the 'contain: layout' css style now actually do what it says it does (contain CSS within it to reference only itself as the view). However this breaks the behavior of all position:fixed components that were calculated using the viewport.

In this case, the wrapping div has contain: layout set, which while previously benign, now causes issues for position:fixed elements that relied on being relative to the viewport (like our FAB and a few other things).

I'll be submitting a fix for our code that disabled that attribute, but I thought it should be noted as this is going to break some people's stuff for sure.

 
Components: Blink>CSS
Labels: Needs-Bisect Needs-Triage-M70 Hotlist-Google
Status: WontFix (was: Unconfirmed)
Thanks for the report. This is indeed an intentional change to support CSS Contains in a situation where it was not previously supported.

We're carefully monitoring the rollout to spot potential breakages.

If you can't push a fix in time please let us know and we'll see if we can delay the rollout. Thanks.
 

Sign in to add a comment