Fixes to scope

as discssued in
https://github.com/twbs/bootstrap/issues/15117#issuecomment-63029993

- added ``scope="row"`` to row headers
- made sure row headers are actual ``<th>`` elements
- removed ``scope="col"`` where it was redundant
- simplified table examples with (to me) unnecessary
``rowspan``/``colspan`` (unless you really want complex tables, in which
case we would need full-on ``id`` and ``headers`` attributes to make
sure each table cell has an explicit association with the related header
cells - overkill, in my opinion)
- one table (in typography) left header-less, as it's more or less presentational (though its structure is still important, hence not adding ``role="presentation"``)

diff --git a/docs/_includes/components/panels.html b/docs/_includes/components/panels.html
index acf32c51c5770a79d6fc903723c39e747fa8ada8..501e4ddd347353f620e48e6a9ca327b35108d120 100644 (file)
--- a/docs/_includes/components/panels.html
+++ b/docs/_includes/components/panels.html
@@ -150,19 +150,19 @@
         </thead>
         <tbody>
           <tr>
-            <td>1</td>
+            <th scope="row">1</th>
             <td>Mark</td>
             <td>Otto</td>
             <td>@mdo</td>
           </tr>
           <tr>
-            <td>2</td>
+            <th scope="row">2</th>
             <td>Jacob</td>
             <td>Thornton</td>
             <td>@fat</td>
           </tr>
           <tr>
-            <td>3</td>
+            <th scope="row">3</th>
             <td>Larry</td>
             <td>the Bird</td>
             <td>@twitter</td>
@@ -204,19 +204,19 @@
         </thead>
         <tbody>
           <tr>
-            <td>1</td>
+            <th scope="row">1</th>
             <td>Mark</td>
             <td>Otto</td>
             <td>@mdo</td>
           </tr>
           <tr>
-            <td>2</td>
+            <th scope="row">2</th>
             <td>Jacob</td>
             <td>Thornton</td>
             <td>@fat</td>
           </tr>
           <tr>
-            <td>3</td>
+            <th scope="row">3</th>
             <td>Larry</td>
             <td>the Bird</td>
             <td>@twitter</td>

diff --git a/docs/_includes/css/grid.html b/docs/_includes/css/grid.html
index cea5b17ee8051bf8cb7854dc1723c9c5547e4830..3563aa78a292f296fcff6ec2e75756177932de15 100644 (file)
--- a/docs/_includes/css/grid.html
+++ b/docs/_includes/css/grid.html
@@ -68,49 +68,49 @@
       </thead>
       <tbody>
         <tr>
-          <th class="text-nowrap">Grid behavior</th>
+          <th class="text-nowrap" scope="row">Grid behavior</th>
           <td>Horizontal at all times</td>
           <td colspan="3">Collapsed to start, horizontal above breakpoints</td>
         </tr>
         <tr>
-          <th class="text-nowrap">Container width</th>
+          <th class="text-nowrap" scope="row">Container width</th>
           <td>None (auto)</td>
           <td>750px</td>
           <td>970px</td>
           <td>1170px</td>
         </tr>
         <tr>
-          <th class="text-nowrap">Class prefix</th>
+          <th class="text-nowrap" scope="row">Class prefix</th>
           <td><code>.col-xs-</code></td>
           <td><code>.col-sm-</code></td>
           <td><code>.col-md-</code></td>
           <td><code>.col-lg-</code></td>
         </tr>
         <tr>
-          <th class="text-nowrap"># of columns</th>
+          <th class="text-nowrap" scope="row"># of columns</th>
           <td colspan="4">12</td>
         </tr>
         <tr>
-          <th class="text-nowrap">Column width</th>
+          <th class="text-nowrap" scope="row">Column width</th>
           <td class="text-muted">Auto</td>
           <td>~62px</td>
           <td>~81px</td>
           <td>~97px</td>
         </tr>
         <tr>
-          <th class="text-nowrap">Gutter width</th>
+          <th class="text-nowrap" scope="row">Gutter width</th>
           <td colspan="4">30px (15px on each side of a column)</td>
         </tr>
         <tr>
-          <th class="text-nowrap">Nestable</th>
+          <th class="text-nowrap" scope="row">Nestable</th>
           <td colspan="4">Yes</td>
         </tr>
         <tr>
-          <th class="text-nowrap">Offsets</th>
+          <th class="text-nowrap" scope="row">Offsets</th>
           <td colspan="4">Yes</td>
         </tr>
         <tr>
-          <th class="text-nowrap">Column ordering</th>
+          <th class="text-nowrap" scope="row">Column ordering</th>
           <td colspan="4">Yes</td>
         </tr>
       </tbody>

diff --git a/docs/_includes/css/responsive-utilities.html b/docs/_includes/css/responsive-utilities.html
index f32f59c4e2a5c77ec10bffaa576df7f5c7d72813..ac73bf645ffa98bc7ef6af814bc2cda078de90dc 100644 (file)
--- a/docs/_includes/css/responsive-utilities.html
+++ b/docs/_includes/css/responsive-utilities.html
@@ -32,28 +32,28 @@
       </thead>
       <tbody>
         <tr>
-          <th><code>.visible-xs-*</code></th>
+          <th scope="row"><code>.visible-xs-*</code></th>
           <td class="is-visible">Visible</td>
           <td class="is-hidden">Hidden</td>
           <td class="is-hidden">Hidden</td>
           <td class="is-hidden">Hidden</td>
         </tr>
         <tr>
-          <th><code>.visible-sm-*</code></th>
+          <th scope="row"><code>.visible-sm-*</code></th>
           <td class="is-hidden">Hidden</td>
           <td class="is-visible">Visible</td>
           <td class="is-hidden">Hidden</td>
           <td class="is-hidden">Hidden</td>
         </tr>
         <tr>
-          <th><code>.visible-md-*</code></th>
+          <th scope="row"><code>.visible-md-*</code></th>
           <td class="is-hidden">Hidden</td>
           <td class="is-hidden">Hidden</td>
           <td class="is-visible">Visible</td>
           <td class="is-hidden">Hidden</td>
         </tr>
         <tr>
-          <th><code>.visible-lg-*</code></th>
+          <th scope="row"><code>.visible-lg-*</code></th>
           <td class="is-hidden">Hidden</td>
           <td class="is-hidden">Hidden</td>
           <td class="is-hidden">Hidden</td>
@@ -62,28 +62,28 @@
       </tbody>
       <tbody>
         <tr>
-          <th><code>.hidden-xs</code></th>
+          <th scope="row"><code>.hidden-xs</code></th>
           <td class="is-hidden">Hidden</td>
           <td class="is-visible">Visible</td>
           <td class="is-visible">Visible</td>
           <td class="is-visible">Visible</td>
         </tr>
         <tr>
-          <th><code>.hidden-sm</code></th>
+          <th scope="row"><code>.hidden-sm</code></th>
           <td class="is-visible">Visible</td>
           <td class="is-hidden">Hidden</td>
           <td class="is-visible">Visible</td>
           <td class="is-visible">Visible</td>
         </tr>
         <tr>
-          <th><code>.hidden-md</code></th>
+          <th scope="row"><code>.hidden-md</code></th>
           <td class="is-visible">Visible</td>
           <td class="is-visible">Visible</td>
           <td class="is-hidden">Hidden</td>
           <td class="is-visible">Visible</td>
         </tr>
         <tr>
-          <th><code>.hidden-lg</code></th>
+          <th scope="row"><code>.hidden-lg</code></th>
           <td class="is-visible">Visible</td>
           <td class="is-visible">Visible</td>
           <td class="is-visible">Visible</td>
@@ -104,15 +104,15 @@
       </thead>
       <tbody>
         <tr>
-          <td><code>.visible-*-block</code></td>
+          <th scope="row"><code>.visible-*-block</code></th>
           <td><code>display: block;</code></td>
         </tr>
         <tr>
-          <td><code>.visible-*-inline</code></td>
+          <th scope="row"><code>.visible-*-inline</code></th>
           <td><code>display: inline;</code></td>
         </tr>
         <tr>
-          <td><code>.visible-*-inline-block</code></td>
+          <th scope="row"><code>.visible-*-inline-block</code></th>
           <td><code>display: inline-block;</code></td>
         </tr>
       </tbody>
@@ -134,7 +134,7 @@
       </thead>
       <tbody>
         <tr>
-          <th>
+          <th scope="row">
             <code>.visible-print-block</code><br>
             <code>.visible-print-inline</code><br>
             <code>.visible-print-inline-block</code>
@@ -143,7 +143,7 @@
           <td class="is-visible">Visible</td>
         </tr>
         <tr>
-          <th><code>.hidden-print</code></th>
+          <th scope="row"><code>.hidden-print</code></th>
           <td class="is-visible">Visible</td>
           <td class="is-hidden">Hidden</td>
         </tr>

diff --git a/docs/_includes/css/sass.html b/docs/_includes/css/sass.html
index 2d5fabbcdd6444ea16abbf3be3403d8705627006..35739ddc6d7a90a0c107a85555e2273ce3ac2316 100644 (file)
--- a/docs/_includes/css/sass.html
+++ b/docs/_includes/css/sass.html
@@ -15,27 +15,27 @@
       </thead>
       <tbody>
         <tr>
-          <th><code>lib/</code></th>
+          <th scope="row"><code>lib/</code></th>
           <td>Ruby gem code (Sass configuration, Rails and Compass integrations)</td>
         </tr>
         <tr>
-          <th><code>tasks/</code></th>
+          <th scope="row"><code>tasks/</code></th>
           <td>Converter scripts (turning upstream Less to Sass)</td>
         </tr>
         <tr>
-          <th><code>test/</code></th>
+          <th scope="row"><code>test/</code></th>
           <td>Compilation tests</td>
         </tr>
         <tr>
-          <th><code>templates/</code></th>
+          <th scope="row"><code>templates/</code></th>
           <td>Compass package manifest</td>
         </tr>
         <tr>
-          <th><code>vendor/assets/</code></th>
+          <th scope="row"><code>vendor/assets/</code></th>
           <td>Sass, JavaScript, and font files</td>
         </tr>
         <tr>
-          <th><code>Rakefile</code></th>
+          <th scope="row"><code>Rakefile</code></th>
           <td>Internal tasks, such as rake and convert</td>
         </tr>
       </tbody>

diff --git a/docs/_includes/css/tables.html b/docs/_includes/css/tables.html
index aba4a3af829ee390126f24425deee4ed8e899227..cf70b651ae6a8a491ebc693cc9e952c064ed7f0b 100644 (file)
--- a/docs/_includes/css/tables.html
+++ b/docs/_includes/css/tables.html
@@ -16,19 +16,19 @@
       </thead>
       <tbody>
         <tr>
-          <td>1</td>
+          <th scope="row">1</th>
           <td>Mark</td>
           <td>Otto</td>
           <td>@mdo</td>
         </tr>
         <tr>
-          <td>2</td>
+          <th scope="row">2</th>
           <td>Jacob</td>
           <td>Thornton</td>
           <td>@fat</td>
         </tr>
         <tr>
-          <td>3</td>
+          <th scope="row">3</th>
           <td>Larry</td>
           <td>the Bird</td>
           <td>@twitter</td>
@@ -61,19 +61,19 @@
       </thead>
       <tbody>
         <tr>
-          <td>1</td>
+          <th scope="row">1</th>
           <td>Mark</td>
           <td>Otto</td>
           <td>@mdo</td>
         </tr>
         <tr>
-          <td>2</td>
+          <th scope="row">2</th>
           <td>Jacob</td>
           <td>Thornton</td>
           <td>@fat</td>
         </tr>
         <tr>
-          <td>3</td>
+          <th scope="row">3</th>
           <td>Larry</td>
           <td>the Bird</td>
           <td>@twitter</td>
@@ -102,25 +102,21 @@
       </thead>
       <tbody>
         <tr>
-          <td rowspan="2">1</td>
+          <th scope="row">1</th>
           <td>Mark</td>
           <td>Otto</td>
           <td>@mdo</td>
         </tr>
         <tr>
-          <td>Mark</td>
-          <td>Otto</td>
-          <td>@TwBootstrap</td>
-        </tr>
-        <tr>
-          <td>2</td>
+          <th scope="row">2</th>
           <td>Jacob</td>
           <td>Thornton</td>
           <td>@fat</td>
         </tr>
         <tr>
-          <td>3</td>
-          <td colspan="2">Larry the Bird</td>
+          <th scope="row">3</th>
+          <td>Larry</td>
+          <td>the Bird</td>
           <td>@twitter</td>
         </tr>
       </tbody>
@@ -147,20 +143,21 @@
       </thead>
       <tbody>
         <tr>
-          <td>1</td>
+          <th scope="row">1</th>
           <td>Mark</td>
           <td>Otto</td>
           <td>@mdo</td>
         </tr>
         <tr>
-          <td>2</td>
+          <th scope="row">2</th>
           <td>Jacob</td>
           <td>Thornton</td>
           <td>@fat</td>
         </tr>
         <tr>
-          <td>3</td>
-          <td colspan="2">Larry the Bird</td>
+          <th scope="row">3</th>
+          <td>Larry</td>
+          <td>the Bird</td>
           <td>@twitter</td>
         </tr>
       </tbody>
@@ -187,19 +184,19 @@
       </thead>
       <tbody>
         <tr>
-          <td>1</td>
+          <th scope="row">1</th>
           <td>Mark</td>
           <td>Otto</td>
           <td>@mdo</td>
         </tr>
         <tr>
-          <td>2</td>
+          <th scope="row">2</th>
           <td>Jacob</td>
           <td>Thornton</td>
           <td>@fat</td>
         </tr>
         <tr>
-          <td>3</td>
+          <th scope="row">3</th>
           <td colspan="2">Larry the Bird</td>
           <td>@twitter</td>
         </tr>
@@ -229,33 +226,33 @@
       </thead>
       <tbody>
         <tr>
-          <td>
+          <th scope="row">
             <code>.active</code>
-          </td>
+          </th>
           <td>Applies the hover color to a particular row or cell</td>
         </tr>
         <tr>
-          <td>
+          <th scope="row">
             <code>.success</code>
-          </td>
+          </th>
           <td>Indicates a successful or positive action</td>
         </tr>
         <tr>
-          <td>
+          <th scope="row">
             <code>.info</code>
-          </td>
+          </th>
           <td>Indicates a neutral informative change or action</td>
         </tr>
         <tr>
-          <td>
+          <th scope="row">
             <code>.warning</code>
-          </td>
+          </th>
           <td>Indicates a warning that might need attention</td>
         </tr>
         <tr>
-          <td>
+          <th scope="row">
             <code>.danger</code>
-          </td>
+          </th>
           <td>Indicates a dangerous or potentially negative action</td>
         </tr>
       </tbody>
@@ -273,55 +270,55 @@
       </thead>
       <tbody>
         <tr class="active">
-          <td>1</td>
+          <th scope="row">1</th>
           <td>Column content</td>
           <td>Column content</td>
           <td>Column content</td>
         </tr>
         <tr>
-          <td>2</td>
+          <th scope="row">2</th>
           <td>Column content</td>
           <td>Column content</td>
           <td>Column content</td>
         </tr>
         <tr class="success">
-          <td>3</td>
+          <th scope="row">3</th>
           <td>Column content</td>
           <td>Column content</td>
           <td>Column content</td>
         </tr>
         <tr>
-          <td>4</td>
+          <th scope="row">4</th>
           <td>Column content</td>
           <td>Column content</td>
           <td>Column content</td>
         </tr>
         <tr class="info">
-          <td>5</td>
+          <th scope="row">5</th>
           <td>Column content</td>
           <td>Column content</td>
           <td>Column content</td>
         </tr>
         <tr>
-          <td>6</td>
+          <th scope="row">6</th>
           <td>Column content</td>
           <td>Column content</td>
           <td>Column content</td>
         </tr>
         <tr class="warning">
-          <td>7</td>
+          <th scope="row">7</th>
           <td>Column content</td>
           <td>Column content</td>
           <td>Column content</td>
         </tr>
         <tr>
-          <td>8</td>
+          <th scope="row">8</th>
           <td>Column content</td>
           <td>Column content</td>
           <td>Column content</td>
         </tr>
         <tr class="danger">
-          <td>9</td>
+          <th scope="row">9</th>
           <td>Column content</td>
           <td>Column content</td>
           <td>Column content</td>
@@ -381,7 +378,7 @@
         </thead>
         <tbody>
           <tr>
-            <td>1</td>
+            <th scope="row">1</th>
             <td>Table cell</td>
             <td>Table cell</td>
             <td>Table cell</td>
@@ -390,7 +387,7 @@
             <td>Table cell</td>
           </tr>
           <tr>
-            <td>2</td>
+            <th scope="row">2</th>
             <td>Table cell</td>
             <td>Table cell</td>
             <td>Table cell</td>
@@ -399,7 +396,7 @@
             <td>Table cell</td>
           </tr>
           <tr>
-            <td>3</td>
+            <th scope="row">3</th>
             <td>Table cell</td>
             <td>Table cell</td>
             <td>Table cell</td>
@@ -426,7 +423,7 @@
         </thead>
         <tbody>
           <tr>
-            <td>1</td>
+            <th scope="row">1</th>
             <td>Table cell</td>
             <td>Table cell</td>
             <td>Table cell</td>
@@ -435,7 +432,7 @@
             <td>Table cell</td>
           </tr>
           <tr>
-            <td>2</td>
+            <th scope="row">2</th>
             <td>Table cell</td>
             <td>Table cell</td>
             <td>Table cell</td>
@@ -444,7 +441,7 @@
             <td>Table cell</td>
           </tr>
           <tr>
-            <td>3</td>
+            <th scope="row">3</th>
             <td>Table cell</td>
             <td>Table cell</td>
             <td>Table cell</td>

diff --git a/docs/_includes/getting-started/browser-device-support.html b/docs/_includes/getting-started/browser-device-support.html
index 509daf2675171a6cdf6c15214d90b4cfcf29fd0e..34d06d8ddd19c1f19d6d767a0d39b05a1e24399d 100644 (file)
--- a/docs/_includes/getting-started/browser-device-support.html
+++ b/docs/_includes/getting-started/browser-device-support.html
@@ -18,7 +18,7 @@
       </thead>
       <tbody>
         <tr>
-          <th>Android</th>
+          <th scope="row">Android</th>
           <td class="text-success"><span class="glyphicon glyphicon-ok" aria-hidden="true"></span> Supported</td>
           <td class="text-success"><span class="glyphicon glyphicon-ok" aria-hidden="true"></span> Supported</td>
           <td class="text-muted" rowspan="3" style="vertical-align: middle;">N/A</td>
@@ -26,21 +26,21 @@
           <td class="text-muted">N/A</td>
         </tr>
         <tr>
-          <th>iOS</th>
+          <th scope="row">iOS</th>
           <td class="text-success"><span class="glyphicon glyphicon-ok" aria-hidden="true"></span> Supported</td>
           <td class="text-muted">N/A</td>
           <td class="text-danger"><span class="glyphicon glyphicon-remove" aria-hidden="true"></span> Not Supported</td>
           <td class="text-success"><span class="glyphicon glyphicon-ok" aria-hidden="true"></span> Supported</td>
         </tr>
         <tr>
-          <th>Mac OS X</th>
+          <th scope="row">Mac OS X</th>
           <td class="text-success"><span class="glyphicon glyphicon-ok" aria-hidden="true"></span> Supported</td>
           <td class="text-success"><span class="glyphicon glyphicon-ok" aria-hidden="true"></span> Supported</td>
           <td class="text-success"><span class="glyphicon glyphicon-ok" aria-hidden="true"></span> Supported</td>
           <td class="text-success"><span class="glyphicon glyphicon-ok" aria-hidden="true"></span> Supported</td>
         </tr>
         <tr>
-          <th>Windows</th>
+          <th scope="row">Windows</th>
           <td class="text-success"><span class="glyphicon glyphicon-ok" aria-hidden="true"></span> Supported</td>
           <td class="text-success"><span class="glyphicon glyphicon-ok" aria-hidden="true"></span> Supported</td>
           <td class="text-success"><span class="glyphicon glyphicon-ok" aria-hidden="true"></span> Supported</td>
@@ -59,9 +59,9 @@
     <table class="table table-bordered table-striped">
       <thead>
         <tr>
-          <th scope="col" class="col-xs-4">Feature</th>
-          <th scope="col" class="col-xs-4">Internet Explorer 8</th>
-          <th scope="col" class="col-xs-4">Internet Explorer 9</th>
+          <th class="col-xs-4">Feature</th>
+          <th class="col-xs-4">Internet Explorer 8</th>
+          <th class="col-xs-4">Internet Explorer 9</th>
         </tr>
       </thead>
       <tbody>