Merge pull request #5362 from dauwhe/master

[css-inline-3] Add illustration of text-edge property
w3c · Aug 3, 2020 · d8c62a9 · d8c62a9
2 parents abc0367 + c2dc271
commit d8c62a9
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 0 deletions.
diff --git a/css-inline-3/Overview.bs b/css-inline-3/Overview.bs
@@ -1047,6 +1047,16 @@ Inline Box Edge Metrics: the 'text-edge' property</h3>
 	in which case the box’s own 'line-height' is used to add spacing--
 	the box’s margin, padding, and border also contribute
 	to the size of the [=line box=].
+
+	<figure>
+		<img src="images/text-edge.png" width="480"
+		     alt="three different values of the text-edge property."  >
+		<figcaption>
+			The 'text-edge' property, showing values for ''text-edge/leading'',
+			''text-edge/cap'', and ''text-edge/ex''.
+			The red lines indicate the layout bounds of the inline box.
+		</figcaption>
+	</figure>
 
 	<div class="note">
 	<p>When 'text-edge' is ''text-edge/leading'',

diff --git a/css-inline-3/images/text-edge.png b/css-inline-3/images/text-edge.png