New issue
Advanced search Search tips

Issue 896149 link

Starred by 3 users
Status: WontFix
Owner:
r...@igalia.com
Closed: Oct 17
Cc:
ajha@chromium.org
e...@chromium.org
style-bugs@google.com
Components:
EstimatedDays: ----
NextAction: ----
OS: Mac
Pri: 1
Type: Bug-Regression



Sign in to add a comment

Broken positon fixed with contain layout

Reported by nikolay....@gmail.com, Oct 17 
UserAgent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/70.0.3538.67 Safari/537.36

Steps to reproduce the problem:
1. Create container div with contain: layout
2. Create wrapper in container with position fixed
3. 

What is the expected behavior?
Wrapper position at top window browser

What went wrong?
Wrapper position isn't at top window

https://jsfiddle.net/NikSol/4t3gn056/1/

Did this work before? N/A 

Does this work in other browsers? Yes

Chrome version: 70.0.3538.67  Channel: stable
OS Version: OS X 10.13.6
Flash Version:

Comment 2 Deleted

Comment 3 Deleted

Comment 4 Deleted

Comment 5 by nikolay....@gmail.com, Oct 17 

Delete comment ⚐
https://jsfiddle.net/NikSol/4t3gn056/7/ remove css property contain from css class container and block wrapper position at top window. If block container contains css property contain: layout; position block wrapper is not at the top of the window.

Comment 6 by woxxom@gmail.com, Oct 17 

Bisected to r577030 = db71b93784806ce5e46bdadd494c472858f21d43 = https://crrev.com/c/1144939 by rego@igalia.com
"[css-contain] Layout containment abspos and fixed descendants"
Landed in 70.0.3499.0

	An element with "contain: layout" should be the containing block
	of any absolutely or fixed positioned descendants.

	The spec is very clear regarding this
	(https://drafts.csswg.org/css-contain/#containment-layout):
	"The element acts as a containing block for absolutely positioned
	 and fixed positioned descendants."

Comment 7 by ajha@chromium.org, Oct 17

Cc: ajha@chromium.org e...@chromium.org
Components: Blink>CSS Blink>Layout
Labels: -Type-Bug -Pri-2 RegressedIn-70 ReleaseBlock-Stable Target-70 Target-71 Target-72 M-70 FoundIn-71 FoundIn-70 FoundIn-72 hasbisect Pri-1 Type-Bug-Regression
Owner: r...@igalia.com
Status: Assigned (was: Unconfirmed)
Thanks woxxom@ for the bisect, adding RB-Stable for M-70 based on bisect result and since CL landed in M-70. Feel free to adjust the blocker/milestone if this should not be blocking.

Note: Issue is reproducible on the latest canary as well 72.0.3583.0 as tested on Mac OS 10.13.6 as well. Don't have access to Win,Linux systems for now, will update the behavior soon.

Comment 8 by r...@igalia.com, Oct 17

Status: WontFix (was: Assigned)
This is the intended behavior, as the commit message says the spec is very clear on this:
>	The spec is very clear regarding this
>	(https://drafts.csswg.org/css-contain/#containment-layout):
>	"The element acts as a containing block for absolutely positioned
>	 and fixed positioned descendants."

So if the containing block is the <div> it's normal it doesn't go to the top left corner (due to usual margin/paddings on <html> and <body> elements).
I'm adding a border on the <div> in the example so it's clearer: https://jsfiddle.net/19oj5qzx/
►

Sign in to add a comment