Editorial: add a table for the translate attribute

Helps with #9832

source

@@ -13406,27 +13406,51 @@ Transport Protocol">HTTP&lt;/abbr> today.&lt;/p></code></pre> <!-- DO NOT REWRAP
            for examples, see https://www.w3.org/Bugs/Public/show_bug.cgi?id=17954 -->
 
   <p>The <dfn element-attr for="html-global"><code data-x="attr-translate">translate</code></dfn>
-  attribute is an <span>enumerated attribute</span> that is used to specify whether an element's
-  attribute values and the values of its <code>Text</code> node children are to be translated when
-  the page is localized, or whether to leave them unchanged.</p>
-
-  <p>The attribute's keywords are the empty string, <code data-x="">yes</code>, and <code
-  data-x="">no</code>. The empty string and the <code data-x="">yes</code> keyword map to the
-  <i>yes</i> state. The <code data-x="">no</code> keyword maps to the <i>no</i> state. In addition,
-  there is a third state, the <i>inherit</i> state, which is the <i
-  data-x="missing value default">missing value default</i> and <i
-  data-x="invalid value default">invalid value default</i>.</p>
+  attribute is an <span>enumerated attribute</span> with the following keywords and states:</p>
+
+  <table>
+   <thead>
+    <tr>
+     <th>Keyword
+     <th>State
+     <th>Brief description
+   <tbody>
+    <tr>
+     <td>The empty string
+     <td rowspan=2><dfn data-x="attr-translate-yes-state">Yes state</dfn>
+     <td rowspan=2>Sets the <span>translation mode</span> state the <span>translate-enabled</span>
+     state.
+    <tr>
+     <td><dfn attr-value for="attr-translate"><code
+     data-x="attr-translate-yes-keyword">yes</code></dfn>
+    <tr>
+     <td><dfn attr-value for="attr-translate"><code
+     data-x="attr-translate-no-keyword">no</code></dfn>
+     <td><dfn data-x="attr-translate-no-state">No state</dfn>
+     <td>Sets the <span>translation mode</span> state the <span>no-translate</span> state.
+    <tr>
+     <td><dfn attr-value for="attr-translate"><code
+     data-x="attr-translate-inherit-keyword">inherit</code></dfn>
+     <td><dfn data-x="attr-translate-inherit-state">Inherit state</dfn>
+     <td>Determine the <span>translation mode</span> state from its <span>parent element</span>.
+  </table>
+
+  <p>The attribute's <i data-x="missing value default">missing value default</i> and <i
+  data-x="invalid value default">invalid value default</i> are both the <span
+  data-x="attr-translate-inherit-state">inherit state</span>.</p>
 
   <p>Each element (even non-HTML elements) has a <dfn>translation mode</dfn>, which is in either the
   <span>translate-enabled</span> state or the <span>no-translate</span> state. If an <span
   data-x="HTML elements">HTML element</span>'s <code data-x="attr-translate">translate</code>
-  attribute is in the <i>yes</i> state, then the element's <span>translation mode</span> is in the
-  <span>translate-enabled</span> state; otherwise, if the element's <code
-  data-x="attr-translate">translate</code> attribute is in the <i>no</i> state, then the element's
-  <span>translation mode</span> is in the <span>no-translate</span> state. Otherwise, either the
-  element's <code data-x="attr-translate">translate</code> attribute is in the <i>inherit</i> state,
-  or the element is not an <span data-x="HTML elements">HTML element</span> and thus does not have a
-  <code data-x="attr-translate">translate</code> attribute; in either case, the element's
+  attribute is in the <i data-x="attr-translate-yes-state">yes</i> state, then the element's
+  <span>translation mode</span> is in the <span>translate-enabled</span> state; otherwise, if the
+  element's <code data-x="attr-translate">translate</code> attribute is in the <i
+  data-x="attr-translate-no-state">no</i> state, then the element's <span>translation mode</span> is
+  in the <span>no-translate</span> state. Otherwise, either the element's <code
+  data-x="attr-translate">translate</code> attribute is in the <i
+  data-x="attr-translate-inherit-state">inherit</i> state, or the element is not an <span
+  data-x="HTML elements">HTML element</span> and thus does not have a <code
+  data-x="attr-translate">translate</code> attribute; in either case, the element's
   <span>translation mode</span> is in the same state as its <span>parent element</span>'s, if any,
   or in the <span>translate-enabled</span> state, if the element's <span>parent element</span> is
   null.</p>