Support this project by becoming a sponsor. Your logo will show up here with a link to your website. [[Become a sponsor](https://opencollective.com/bootstrap#sponsor)]
-[](https://opencollective.com/bootstrap/sponsor/0/website)
-[](https://opencollective.com/bootstrap/sponsor/1/website)
-[](https://opencollective.com/bootstrap/sponsor/2/website)
-[](https://opencollective.com/bootstrap/sponsor/3/website)
-[](https://opencollective.com/bootstrap/sponsor/4/website)
-[](https://opencollective.com/bootstrap/sponsor/5/website)
-[](https://opencollective.com/bootstrap/sponsor/6/website)
-[](https://opencollective.com/bootstrap/sponsor/7/website)
-[](https://opencollective.com/bootstrap/sponsor/8/website)
-[](https://opencollective.com/bootstrap/sponsor/9/website)
+[](https://opencollective.com/bootstrap/sponsor/0/website)
+[](https://opencollective.com/bootstrap/sponsor/1/website)
+[](https://opencollective.com/bootstrap/sponsor/2/website)
+[](https://opencollective.com/bootstrap/sponsor/3/website)
+[](https://opencollective.com/bootstrap/sponsor/4/website)
+[](https://opencollective.com/bootstrap/sponsor/5/website)
+[](https://opencollective.com/bootstrap/sponsor/6/website)
+[](https://opencollective.com/bootstrap/sponsor/7/website)
+[](https://opencollective.com/bootstrap/sponsor/8/website)
+[](https://opencollective.com/bootstrap/sponsor/9/website)
## Backers
## How nesting works
-To prevent _any_ styles from leaking to nested tables, we use the child combinator (`>`) selector in our CSS. Since we need to target all the `td`s and `th`s in the `thead`, `tbody`, and `tfoot`, our selector would look pretty long without it. As such, we use the rather odd looking `.table > :not(caption) > * > * ` selector to target all `td`s and `th`s of the `.table`, but none of any potential nested tables.
+To prevent _any_ styles from leaking to nested tables, we use the child combinator (`>`) selector in our CSS. Since we need to target all the `td`s and `th`s in the `thead`, `tbody`, and `tfoot`, our selector would look pretty long without it. As such, we use the rather odd looking `.table > :not(caption) > * > *` selector to target all `td`s and `th`s of the `.table`, but none of any potential nested tables.
Note that if you add `<tr>`s as direct children of a table, those `<tr>` will be wrapped in a `<tbody>` by default, thus making our selectors work as intended.
While we don't have a prebuilt example for using [PurgeCSS](https://github.com/FullHuman/purgecss) with Bootstrap, there are some helpful articles and walkthroughs that the community has written. Here are some options:
-- https://medium.com/dwarves-foundation/remove-unused-css-styles-from-bootstrap-using-purgecss-88395a2c5772
-- https://lukencode.com/2018/07/29/automatically-removeunused-css-from-bootstrap-or-other-frameworks/
+- <https://medium.com/dwarves-foundation/remove-unused-css-styles-from-bootstrap-using-purgecss-88395a2c5772>
+- <https://lukencode.com/2018/07/29/automatically-removeunused-css-from-bootstrap-or-other-frameworks/>
Lastly, this [CSS Tricks article on unused CSS](https://css-tricks.com/how-do-you-remove-unused-css-from-a-site/) shows how to use PurgeCSS and other similar tools.