Cleanup formatting of legacy key value tables.
--- a/html/DOM3-Events.html Mon Aug 19 13:04:52 2013 -0700
+++ b/html/DOM3-Events.html Mon Aug 19 13:32:45 2013 -0700
@@ -6794,83 +6794,30 @@
<p>The virtual key codes for the following keys do not usually change with keyboard layouts on desktop systems:</p>
- <table class="data-table">
- <tr>
- <th><strong>Key</strong></th>
- <th><strong>Virtual Key Code</strong></th>
- </tr>
- <tr>
- <th><code class="key">'Backspace'</code></th>
- <td>8</td>
- </tr>
- <tr>
- <th><code class="key">'Tab'</code></th>
- <td>9</td>
- </tr>
- <tr>
- <th><code class="key">'Enter'</code></th>
- <td>13</td>
- </tr>
- <tr>
- <th><code class="key">'Shift'</code></th>
- <td>16</td>
- </tr>
- <tr>
- <th><code class="key">'Control'</code></th>
- <td>17</td>
- </tr>
- <tr>
- <th><code class="key">'Alt'</code></th>
- <td>18</td>
- </tr>
- <tr>
- <th><code class="key">'CapsLock'</code></th>
- <td>20</td>
- </tr>
- <tr>
- <th><code class="key">'Esc'</code> (Escape)</th>
- <td>27</td>
- </tr>
+ <table class="legacy-key-table">
<tr>
- <th><code class="key">'Spacebar'</code> (Space)</th>
- <td>32</td>
- </tr>
- <tr>
- <th><code class="key">'PageUp'</code></th>
- <td>33</td>
- </tr>
- <tr>
- <th><code class="key">'PageDown'</code></th>
- <td>34</td>
- </tr>
- <tr>
- <th><code class="key">'End'</code></th>
- <td>35</td>
- </tr>
- <tr>
- <th><code class="key">'Home'</code></th>
- <td>36</td>
+ <th>Key</th>
+ <th class="cell-center">Virtual Key</br/>Code</th>
+ <th>Notes</th>
</tr>
- <tr>
- <th><code class="key">'Left'</code></th>
- <td>37</td>
- </tr>
- <tr>
- <th><code class="key">'Up'</code></th>
- <td>38</td>
- </tr>
- <tr>
- <th><code class="key">'Right'</code></th>
- <td>39</td>
- </tr>
- <tr>
- <th><code class="key">'Down'</code></th>
- <td>40</td>
- </tr>
- <tr>
- <th><code class="key">'Del'</code> (Delete)</th>
- <td>46</td>
- </tr>
+ <tr><td><code class="key">'Backspace'</code></td> <td class="cell-center">8</td> <td></td> </tr>
+ <tr><td><code class="key">'Tab'</code></td> <td class="cell-center">9</td> <td></td> </tr>
+ <tr><td><code class="key">'Enter'</code></td> <td class="cell-center">13</td> <td></td> </tr>
+ <tr><td><code class="key">'Shift'</code></td> <td class="cell-center">16</td> <td></td> </tr>
+ <tr><td><code class="key">'Control'</code></td> <td class="cell-center">17</td> <td></td> </tr>
+ <tr><td><code class="key">'Alt'</code></td> <td class="cell-center">18</td> <td></td> </tr>
+ <tr><td><code class="key">'CapsLock'</code></td> <td class="cell-center">20</td> <td></td> </tr>
+ <tr><td><code class="key">'Esc'</code></td> <td class="cell-center">27</td> <td><em>Escape</em></td> </tr>
+ <tr><td><code class="key">'Spacebar'</code></td> <td class="cell-center">32</td> <td><em>Space</em></td> </tr>
+ <tr><td><code class="key">'PageUp'</code></td> <td class="cell-center">33</td> <td></td> </tr>
+ <tr><td><code class="key">'PageDown'</code></td> <td class="cell-center">34</td> <td></td> </tr>
+ <tr><td><code class="key">'End'</code></td> <td class="cell-center">35</td> <td></td> </tr>
+ <tr><td><code class="key">'Home'</code></td> <td class="cell-center">36</td> <td></td> </tr>
+ <tr><td><code class="key">'Left'</code></td> <td class="cell-center">37</td> <td></td> </tr>
+ <tr><td><code class="key">'Up'</code></td> <td class="cell-center">38</td> <td></td> </tr>
+ <tr><td><code class="key">'Right'</code></td> <td class="cell-center">39</td> <td></td> </tr>
+ <tr><td><code class="key">'Down'</code></td> <td class="cell-center">40</td> <td></td> </tr>
+ <tr><td><code class="key">'Del'</code></td> <td class="cell-center">46</td> <td><em>Delete</em></td> </tr>
</table>
</section>
@@ -6880,99 +6827,34 @@
<p>The following punctuation characters MAY change virtual codes between keyboard layouts, but reporting these values will likely be more compatible with legacy content
expecting US-English keyboard layout:</p>
- <table class="data-table">
- <tr>
- <th><strong>Key</strong></th>
- <th><strong>Virtual Key Code</strong></th>
- </tr>
- <tr>
- <th>Semicolon (<code class="glyph">';'</code>)</th>
- <td>186</td>
- </tr>
- <tr>
- <th>Colon (<code class="glyph">':'</code>)</th>
- <td>186</td>
- </tr>
- <tr>
- <th>Plus (<code class="glyph">'+'</code>)</th>
- <td>187</td>
- </tr>
- <tr>
- <th>Equals sign (<code class="glyph">'='</code>)</th>
- <td>187</td>
- </tr>
- <tr>
- <th>Comma (<code class="glyph">','</code>)</th>
- <td>188</td>
- </tr>
- <tr>
- <th>Less than sign (<code class="glyph">'<'</code>)</th>
- <td>188</td>
- </tr>
- <tr>
- <th>Minus (<code class="glyph">'-'</code>)</th>
- <td>189</td>
- </tr>
- <tr>
- <th>Underscore (<code class="glyph">'_'</code>)</th>
- <td>189</td>
- </tr>
- <tr>
- <th>Period (<code class="glyph">'.'</code>)</th>
- <td>190</td>
- </tr>
- <tr>
- <th>Greater than sign (<code class="glyph">'>'</code>)</th>
- <td>190</td>
- </tr>
+ <table class="legacy-key-table">
<tr>
- <th>Question mark (<code class="glyph">'?'</code>)</th>
- <td>191</td>
- </tr>
- <tr>
- <th>Forward slash (<code class="glyph">'/'</code>)</th>
- <td>191</td>
- </tr>
- <tr>
- <th>Backtick (<code class="glyph">'`'</code>)</th>
- <td>192</td>
- </tr>
- <tr>
- <th>Tilde (<code class="glyph">'~'</code>)</th>
- <td>192</td>
- </tr>
- <tr>
- <th>Opening square bracket (<code class="glyph">'['</code>)</th>
- <td>219</td>
- </tr>
- <tr>
- <th>Opening curly bracket (<code class="glyph">'{'</code>)</th>
- <td>219</td>
+ <th>Key</th>
+ <th class="cell-center">Character</th>
+ <th class="cell-center">Virtual Key</br/>Code</th>
</tr>
- <tr>
- <th>Backslash (<code class="glyph">'\'</code>)</th>
- <td>220</td>
- </tr>
- <tr>
- <th>Pipe (<code class="glyph">'|'</code>)</th>
- <td>220</td>
- </tr>
- <tr>
- <th>Closing square bracket (<code class="glyph">']'</code>)</th>
- <td>221</td>
- </tr>
- <tr>
- <th>Closing curly bracket (<code class="glyph">'}'</code>)</th>
- <td>221</td>
- </tr>
- <tr>
- <th>Single quote (<code class="glyph">'''</code>)</th>
- <td>222</td>
- </tr>
- <tr>
- <th>Double quote (<code class="glyph">'"'</code>)</th>
- <td>222</td>
- </tr>
+ <tr><td>Semicolon</td> <td class="cell-center"><code class="glyph">';'</code></td> <td class="cell-center">186</td> </tr>
+ <tr><td>Colon</td> <td class="cell-center"><code class="glyph">':'</code></td> <td class="cell-center">186</td> </tr>
+ <tr><td>Equals sign</td> <td class="cell-center"><code class="glyph">'='</code></td> <td class="cell-center">187</td> </tr>
+ <tr><td>Plus</td> <td class="cell-center"><code class="glyph">'+'</code></td> <td class="cell-center">187</td> </tr>
+ <tr><td>Comma</td> <td class="cell-center"><code class="glyph">','</code></td> <td class="cell-center">188</td> </tr>
+ <tr><td>Less than sign</td> <td class="cell-center"><code class="glyph">'<'</code></td> <td class="cell-center">188</td> </tr>
+ <tr><td>Minus</td> <td class="cell-center"><code class="glyph">'-'</code></td> <td class="cell-center">189</td> </tr>
+ <tr><td>Underscore</td> <td class="cell-center"><code class="glyph">'_'</code></td> <td class="cell-center">189</td> </tr>
+ <tr><td>Period</td> <td class="cell-center"><code class="glyph">'.'</code></td> <td class="cell-center">190</td> </tr>
+ <tr><td>Greater than sign</td> <td class="cell-center"><code class="glyph">'>'</code></td> <td class="cell-center">190</td> </tr>
+ <tr><td>Forward slash</td> <td class="cell-center"><code class="glyph">'/'</code></td> <td class="cell-center">191</td> </tr>
+ <tr><td>Question mark</td> <td class="cell-center"><code class="glyph">'?'</code></td> <td class="cell-center">191</td> </tr>
+ <tr><td>Backtick</td> <td class="cell-center"><code class="glyph">'`'</code></td> <td class="cell-center">192</td> </tr>
+ <tr><td>Tilde</td> <td class="cell-center"><code class="glyph">'~'</code></td> <td class="cell-center">192</td> </tr>
+ <tr><td>Opening square bracket</td> <td class="cell-center"><code class="glyph">'['</code></td> <td class="cell-center">219</td> </tr>
+ <tr><td>Opening curly brace</td> <td class="cell-center"><code class="glyph">'{'</code></td> <td class="cell-center">219</td> </tr>
+ <tr><td>Backslash</td> <td class="cell-center"><code class="glyph">'\'</code></td> <td class="cell-center">220</td> </tr>
+ <tr><td>Pipe</td> <td class="cell-center"><code class="glyph">'|'</code></td> <td class="cell-center">220</td> </tr>
+ <tr><td>Closing square bracket</td> <td class="cell-center"><code class="glyph">']'</code></td> <td class="cell-center">221</td> </tr>
+ <tr><td>Closing curly brace</td> <td class="cell-center"><code class="glyph">'}'</code></td> <td class="cell-center">221</td> </tr>
+ <tr><td>Single quote</td> <td class="cell-center"><code class="glyph">'''</code></td> <td class="cell-center">222</td> </tr>
+ <tr><td>Double quote</td> <td class="cell-center"><code class="glyph">'"'</code></td> <td class="cell-center">222</td> </tr>
</table>
</section>
</section>
--- a/html/override.css Mon Aug 19 13:04:52 2013 -0700
+++ b/html/override.css Mon Aug 19 13:32:45 2013 -0700
@@ -169,6 +169,26 @@
color:#333399;
}
+/* Formatting for the legacy key tables in the Appendix.
+ */
+.legacy-key-table th {
+ background:none repeat scroll 0 0 #E8EDFF;
+ color:#003399;
+ font-weight:normal;
+ padding: 0.25em 0.5em 0.25em 0.5em;
+}
+
+.legacy-key-table td {
+ background:none repeat scroll 0 0 #ffffff;
+ color:#666699;
+ padding: 0 0.5em 0 0.5em;
+}
+
+.legacy-key-table tr:hover td {
+ background:none repeat scroll 0 0 #E8EDFF;
+ color:#333399;
+}
+
.cell-center {
text-align: center;
}