diff --git a/docs/base-css.html b/docs/base-css.html index acb656417..5c9d07b8e 100644 --- a/docs/base-css.html +++ b/docs/base-css.html @@ -431,81 +431,78 @@ For example, <code>section</code> should be wrapped as inline.

Table markup

-
-
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
TagDescription
- <table> - - Wrapping element for displaying data in a tabular format -
- <thead> - - Container element for table header rows (<tr>) to label table columns -
- <tbody> - - Container element for table rows (<tr>) in the body of the table -
- <tr> - - Container element for a set of table cells (<td> or <th>) that appears on a single row -
- <td> - - Default table cell -
- <th> - - Special table cell for column (or row, depending on scope and placement) labels
- Must be used within a <thead> -
- <caption> - - Description or summary of what the table holds, especially useful for screen readers -
-
-
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
TagDescription
+ <table> + + Wrapping element for displaying data in a tabular format +
+ <thead> + + Container element for table header rows (<tr>) to label table columns +
+ <tbody> + + Container element for table rows (<tr>) in the body of the table +
+ <tr> + + Container element for a set of table cells (<td> or <th>) that appears on a single row +
+ <td> + + Default table cell +
+ <th> + + Special table cell for column (or row, depending on scope and placement) labels
+ Must be used within a <thead> +
+ <caption> + + Description or summary of what the table holds, especially useful for screen readers + 
 <table>
   <thead>
@@ -522,8 +519,7 @@ For example, <code>section</code> should be wrapped as inline.
   </tbody>
 </table>
-
-
+

Table options

@@ -575,233 +571,204 @@ For example, <code>section</code> should be wrapped as inline.

Example tables

1. Default table styles

-
-
-

Tables are automatically styled with only a few borders to ensure readability and maintain structure. With 2.0, the .table class is required.

+

Tables are automatically styled with only a few borders to ensure readability and maintain structure. With 2.0, the .table class is required.

 <table class="table">
   …
 </table>
-
-
-
- - - - - - - - - - - - - - - - - - - - - - - - - - - - -
#First NameLast NameUsername
1MarkOtto@mdo
2JacobThornton@fat
3Larrythe Bird@twitter
- - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
#First NameLast NameUsername
1MarkOtto@mdo
2JacobThornton@fat
3Larrythe Bird@twitter

2. Striped table

-
-
-

Get a little fancy with your tables by adding zebra-striping—just add the .table-striped class.

-

Note: Striped tables use the :nth-child CSS selector and is not available in IE7-IE8.

+

Get a little fancy with your tables by adding zebra-striping—just add the .table-striped class.

+

Note: Striped tables use the :nth-child CSS selector and is not available in IE7-IE8.

 <table class="table table-striped">
   …
 </table>
-
-
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
#First NameLast NameUsername
1MarkOtto@mdo
2JacobThornton@fat
3Larrythe Bird@twitter
-
-
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
#First NameLast NameUsername
1MarkOtto@mdo
2JacobThornton@fat
3Larrythe Bird@twitter

3. Bordered table

-
-
-

Add borders around the entire table and rounded corners for aesthetic purposes.

+

Add borders around the entire table and rounded corners for aesthetic purposes.

 <table class="table table-bordered">
   …
 </table>
-
-
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
#First NameLast NameUsername
1MarkOtto@mdo
MarkOtto@TwBootstrap
2JacobThornton@fat
3Larry the Bird@twitter
-
-
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
#First NameLast NameUsername
1MarkOtto@mdo
MarkOtto@TwBootstrap
2JacobThornton@fat
3Larry the Bird@twitter

4. Condensed table

-
-
-

Make your tables more compact by adding the .table-condensed class to cut table cell padding in half (from 8px to 4px).

+

Make your tables more compact by adding the .table-condensed class to cut table cell padding in half (from 8px to 4px).

 <table class="table table-condensed">
   …
 </table>
-
-
- - - - - - - - - - - - - - - - - - - - - - - - - - - - -
#First NameLast NameUsername
1MarkOtto@mdo
2JacobThornton@fat
3Larry the Bird@twitter
-
-
- + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
#First NameLast NameUsername
1MarkOtto@mdo
2JacobThornton@fat
3Larry the Bird@twitter

5. Combine them all!

-
-
-

Feel free to combine any of the table classes to achieve different looks by utilizing any of the available classes.

+

Feel free to combine any of the table classes to achieve different looks by utilizing any of the available classes.

 <table class="table table-striped table-bordered table-condensed">
   ...
 </table>
-
-
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
Full name
#First NameLast NameUsername
1MarkOtto@mdo
2JacobThornton@fat
3Larry the Bird@twitter
-
-
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Full name
#First NameLast NameUsername
1MarkOtto@mdo
2JacobThornton@fat
3Larry the Bird@twitter
diff --git a/docs/templates/pages/base-css.mustache b/docs/templates/pages/base-css.mustache index 4ac972d21..170a4d45b 100644 --- a/docs/templates/pages/base-css.mustache +++ b/docs/templates/pages/base-css.mustache @@ -362,81 +362,78 @@

{{_i}}Table markup{{/i}}

-
-
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
{{_i}}Tag{{/i}}{{_i}}Description{{/i}}
- <table> - - {{_i}}Wrapping element for displaying data in a tabular format{{/i}} -
- <thead> - - {{_i}}Container element for table header rows (<tr>) to label table columns{{/i}} -
- <tbody> - - {{_i}}Container element for table rows (<tr>) in the body of the table{{/i}} -
- <tr> - - {{_i}}Container element for a set of table cells (<td> or <th>) that appears on a single row{{/i}} -
- <td> - - {{_i}}Default table cell{{/i}} -
- <th> - - {{_i}}Special table cell for column (or row, depending on scope and placement) labels{{/i}}
- {{_i}}Must be used within a <thead>{{/i}} -
- <caption> - - {{_i}}Description or summary of what the table holds, especially useful for screen readers{{/i}} -
-
-
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
{{_i}}Tag{{/i}}{{_i}}Description{{/i}}
+ <table> + + {{_i}}Wrapping element for displaying data in a tabular format{{/i}} +
+ <thead> + + {{_i}}Container element for table header rows (<tr>) to label table columns{{/i}} +
+ <tbody> + + {{_i}}Container element for table rows (<tr>) in the body of the table{{/i}} +
+ <tr> + + {{_i}}Container element for a set of table cells (<td> or <th>) that appears on a single row{{/i}} +
+ <td> + + {{_i}}Default table cell{{/i}} +
+ <th> + + {{_i}}Special table cell for column (or row, depending on scope and placement) labels{{/i}}
+ {{_i}}Must be used within a <thead>{{/i}} +
+ <caption> + + {{_i}}Description or summary of what the table holds, especially useful for screen readers{{/i}} + 
 <table>
   <thead>
@@ -453,8 +450,7 @@
   </tbody>
 </table>
-
-
+

{{_i}}Table options{{/i}}

@@ -506,233 +502,204 @@

{{_i}}Example tables{{/i}}

1. {{_i}}Default table styles{{/i}}

-
-
-

{{_i}}Tables are automatically styled with only a few borders to ensure readability and maintain structure. With 2.0, the .table class is required.{{/i}}

+

{{_i}}Tables are automatically styled with only a few borders to ensure readability and maintain structure. With 2.0, the .table class is required.{{/i}}

 <table class="table">
   …
 </table>
-
-
-
- - - - - - - - - - - - - - - - - - - - - - - - - - - - -
#{{_i}}First Name{{/i}}{{_i}}Last Name{{/i}}{{_i}}Username{{/i}}
1MarkOtto@mdo
2JacobThornton@fat
3Larrythe Bird@twitter
- - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
#{{_i}}First Name{{/i}}{{_i}}Last Name{{/i}}{{_i}}Username{{/i}}
1MarkOtto@mdo
2JacobThornton@fat
3Larrythe Bird@twitter

2. {{_i}}Striped table{{/i}}

-
-
-

{{_i}}Get a little fancy with your tables by adding zebra-striping—just add the .table-striped class.{{/i}}

-

{{_i}}Note: Striped tables use the :nth-child CSS selector and is not available in IE7-IE8.{{/i}}

+

{{_i}}Get a little fancy with your tables by adding zebra-striping—just add the .table-striped class.{{/i}}

+

{{_i}}Note: Striped tables use the :nth-child CSS selector and is not available in IE7-IE8.{{/i}}

 <table class="table table-striped">
   …
 </table>
-
-
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
#{{_i}}First Name{{/i}}{{_i}}Last Name{{/i}}{{_i}}Username{{/i}}
1MarkOtto@mdo
2JacobThornton@fat
3Larrythe Bird@twitter
-
-
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
#{{_i}}First Name{{/i}}{{_i}}Last Name{{/i}}{{_i}}Username{{/i}}
1MarkOtto@mdo
2JacobThornton@fat
3Larrythe Bird@twitter

3. {{_i}}Bordered table{{/i}}

-
-
-

{{_i}}Add borders around the entire table and rounded corners for aesthetic purposes.{{/i}}

+

{{_i}}Add borders around the entire table and rounded corners for aesthetic purposes.{{/i}}

 <table class="table table-bordered">
   …
 </table>
-
-
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
#{{_i}}First Name{{/i}}{{_i}}Last Name{{/i}}{{_i}}Username{{/i}}
1MarkOtto@mdo
MarkOtto@TwBootstrap
2JacobThornton@fat
3Larry the Bird@twitter
-
-
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
#{{_i}}First Name{{/i}}{{_i}}Last Name{{/i}}{{_i}}Username{{/i}}
1MarkOtto@mdo
MarkOtto@TwBootstrap
2JacobThornton@fat
3Larry the Bird@twitter

4. {{_i}}Condensed table{{/i}}

-
-
-

{{_i}}Make your tables more compact by adding the .table-condensed class to cut table cell padding in half (from 8px to 4px).{{/i}}

+

{{_i}}Make your tables more compact by adding the .table-condensed class to cut table cell padding in half (from 8px to 4px).{{/i}}

 <table class="table table-condensed">
   …
 </table>
-
-
- - - - - - - - - - - - - - - - - - - - - - - - - - - - -
#{{_i}}First Name{{/i}}{{_i}}Last Name{{/i}}{{_i}}Username{{/i}}
1MarkOtto@mdo
2JacobThornton@fat
3Larry the Bird@twitter
-
-
- + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
#{{_i}}First Name{{/i}}{{_i}}Last Name{{/i}}{{_i}}Username{{/i}}
1MarkOtto@mdo
2JacobThornton@fat
3Larry the Bird@twitter

5. {{_i}}Combine them all!{{/i}}

-
-
-

{{_i}}Feel free to combine any of the table classes to achieve different looks by utilizing any of the available classes.{{/i}}

+

{{_i}}Feel free to combine any of the table classes to achieve different looks by utilizing any of the available classes.{{/i}}

 <table class="table table-striped table-bordered table-condensed">
   ...
 </table>
-
-
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
{{_i}}Full name{{/i}}
#{{_i}}First Name{{/i}}{{_i}}Last Name{{/i}}{{_i}}Username{{/i}}
1MarkOtto@mdo
2JacobThornton@fat
3Larry the Bird@twitter
-
-
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
{{_i}}Full name{{/i}}
#{{_i}}First Name{{/i}}{{_i}}Last Name{{/i}}{{_i}}Username{{/i}}
1MarkOtto@mdo
2JacobThornton@fat
3Larry the Bird@twitter