Support disable-inline-width attribute when applying layout sizes

[caroqliu]

This allows specifying the sizes on elements without getting the sizing behavior of sizes in AMP (which adds a width based on which media query matches). Addresses #21736

See discussion doc for more

[jridgewell]

Code LGTM. I think this still needs validator changes to make it valid?

[amp-owners-bot]

Hey @ampproject/wg-caching, these files were changed:

validator/validator-main.protoascii

[westonruter]

Is this related to #17053? does the presence of disable-inline-width allow for the browser's underlying sizes behavior to be retained?

[caroqliu]

@westonruter Yes, this is related as it directly resolves the original issue filed:

This might be the expected behavior. But it looks like the <amp-img> sizes attribute causes inline styling to be added to the <amp-img>, which can distort it.

And this seems to be different from the non-AMP behavior of a sizes attribute in an <img>.

[westonruter]

@caroqliu I think I may have identified something that was missed with support for disable-inline-width and that has to do with this CSS rule in ampshared.css:

amphtml/css/ampshared.css

Lines 59 to 65 in 97099ce

	.i-amphtml-layout-responsive,
	[layout=responsive][width][height]:not(.i-amphtml-layout-responsive),
	[width][height][sizes]:not(.i-amphtml-layout-responsive)
	{
	display: block;
	position: relative;
	}

Should not that last selector be changed to exclude elements that have the disable-inline-width attribute? Like so:

- [width][height][sizes]:not(.i-amphtml-layout-responsive)
+ [width][height][sizes]:not([disable-inline-width]):not(.i-amphtml-layout-responsive)

Otherwise, a regression is introduced by adopting disable-inline-width instead of removing the sizes attribute: ampproject/amp-wp#4622 (comment).