[css-shapes-1] Minor fixes for WD (#12284)

Author: noamr

css-shapes-1/Overview.bs

@@ -44,7 +44,7 @@ spec:css-values-5; type:value;
 	text:y-end;
 </pre>
 
-<style type="text/css">
+<style>
 	.singleImgExample {
 		display: block;
 		margin: auto;
@@ -894,7 +894,7 @@ The ''shape()'' Function</h4>
 				and <<arc-size>> has no effect.
 
 			<figure>
-				<img src="images/four-arcs.svg">
+				<img src="images/four-arcs.svg" alt="a depiction of four possible arcs given a start and end point">
 				<figcaption>
 					A depiction of the two possible ellipses,
 					and four possible arcs,
@@ -924,7 +924,7 @@ While the ''polygon()'' shape is also responsive, it only support simple rounded
 
 To demonstrate, let's start with a speech bubble, such as the following:
 
-<img src="images/bubble.svg" width=300 style="background: unset">
+<img src="images/bubble.svg" width=300 style="background: unset" alt="A speech bubble shape">
 
 Using this shape with a ''clip-path'' can be done by using the ''path()'' function:
 
@@ -934,7 +934,7 @@ Using this shape with a ''clip-path'' can be done by using the ''path()'' functi
 
 Altohugh this path can easily scale, the scaled results are not always desirable. e.g. when scaled to a small balloon, the arrow and corners are scaled to become almost invisible:
 
-<img src="images/bubble.svg" width=100 style="background: unset">
+<img src="images/bubble.svg" width=100 style="background: unset" alt="scled-down speech bubble shape">
 
 To construct this shape using the ''shape()'' function, let's start by turning all the pixel values from the ''path'' function to percentages.
 Note that the ''shape()'' function begins with <css>from</css>:
@@ -974,7 +974,7 @@ specifically the ones the control the curves and arrows:
 
 When applied as ''clip-path'', it would looks like the following:
 <p>
-<img src="images/bubble-50.svg" width=150 style="background: unset">
+<img src="images/bubble-50.svg" width=150 style="background: unset" alt="A speech bubble shape, using clip-path">
 </p>
 
 The whole speech bubble is scaled to the reference box, while the curves and arrows stay more constant.
@@ -1026,8 +1026,6 @@ we can make the arrow and radius parametric:
 		curve to var(---radius) top with left top); }
 </pre>
 
-
-
 </div>
 
 <h5 id=interpolating-shape>
@@ -1359,7 +1357,7 @@ Shapes from Box Values</h2>
 	Its syntax is:
 
 	<pre class="prod">
-		<dfn><<shape-box>></dfn> = <<visual-box>> | <l>''margin-box''</l>
+		<dfn><<shape-box>></dfn> = <<visual-box>> | <a data-xref-type="css-value" data-xref-for="<shape-box>">margin-box</a>
 	</pre>
 
 	The definitions of the values are: