Update contain to container

[djmtype]

There was very recently a spec change from contain to container.

https://drafts.csswg.org/css-contain-3/#container-queries.

Change this:

.element {
  contain: layout inline-size;
}

To this:

.element {
  container: inline-size;
}

[jasikpark]

This is a diff spec over CSS Containment Level 2. It is currently an Exploratory Working Draft: if you are implementing anything, please use Level 2 as a reference. We will merge the Level 2 text into this draft once it reaches CR.

from CSS Containment Level 3

I believe this means that the polyfill should be implementing CSS Containment Level 2 still no?

[jasikpark]

On second thought since I've heard this is meant to reflect the current implementation & Chrome Canary uses container, you have a point!

[djmtype]

@jasikpark When I initially posted this issue, I learned of it via CSS Tricks. You can hear Chris Coyier respond, "Oh, it's container now?" https://youtu.be/8Je-zvnQSMg?t=230.

I think contain still works but with some caveat you need to be more verbose like contain: style inline-size layout. However, this spec hasn't been finalized, so it might change yet again.

[HolgerJeromin]

JFYI https://github.com/GoogleChromeLabs/container-query-polyfill