[css-overflow-3][css-contain-1] Define 'overflow-clip-margin', per WG resolution, and make paint containment respect it. Fixes w3c#4934.

Author: tabatkins

css-contain-1/Overview.bs

@@ -733,6 +733,10 @@ Paint Containment</h3>
 		nor does it inhibit the creation of any such mechanism through other properties,
 		<span class=informative>such as 'overflow', 'resize', or 'text-overflow'</span>.
 
+		This clipping shape respects 'overflow-clip-margin',
+		allowing an element with [=paint containment=]
+		to still slightly overflow its normal bounds.
+
 		Note: The behavior is described in this paragraph is equivalent to changing
 		''overflow-x: visible'' into ''overflow-x: clip''
 		and

css-overflow-3/Overview.bs

@@ -489,6 +489,46 @@ Scrolling Origin, Direction, and Restriction</h3>
 
 	The viewport uses the <a>principal writing mode</a> for these calculations.
 
+<h3 id="overflow-clip-margin">
+Expanding ''overflow:clip'' Bounds: the 'overflow-clip-margin' property</h3>
+
+	<pre class=propdef>
+	Name: overflow-clip-margin
+	Value: <<length>>
+	Initial: ''0px''
+	Inherited: no
+	Applies to: all elements
+	Computed value: the computed <<length>>
+	</pre>
+
+	Unlike the scrollable 'overflow' values,
+	which have various additional effects on an element
+	to make it a scroll container,
+	''overflow: clip'' solely has the effect
+	of preventing an element from painting outside its bounds.
+	The 'overflow-clip-margin' property
+	determines precisely <em>how far</em> outside its bounds
+	the element is allowed to paint
+	before being clipped.
+
+	Values are defined as follows:
+
+	<dl dfn-type=value dfn-for=overflow-clip-margin>
+		: <dfn><<length>></dfn>
+		::
+			If the element does not have ''overflow: clip''
+			(or another property defined to respect this property),
+			this property has no effect.
+
+			Otherwise, dictates how much the clipping shape is expanded
+			from its initial shape.
+			The clipping shape is expanded outward in all directions
+			by the specified <<length>>,
+			in exactly the same way as a 'box-shadow' grows
+			due to a positive spread distance
+			(including the effect on rounded corners).
+	</dl>
+
 <h3 id="overflow-propagation">
 Overflow Viewport Propagation</h3>