diff options
| author | Mark Otto <[email protected]> | 2015-05-29 14:05:31 -0700 |
|---|---|---|
| committer | Mark Otto <[email protected]> | 2015-05-29 14:05:31 -0700 |
| commit | 7c552d70fcf5774e2a858c0ed4caa19357fcd878 (patch) | |
| tree | e988ef686c682c8ed5a60513602fff9daa4bf86b /docs | |
| parent | e6bc8da426059c9b75dbc74f335b3ef21dcab2d8 (diff) | |
| download | bootstrap-7c552d70fcf5774e2a858c0ed4caa19357fcd878.tar.xz bootstrap-7c552d70fcf5774e2a858c0ed4caa19357fcd878.zip | |
fix utils ToC listing by unnesting headings
Diffstat (limited to 'docs')
| -rw-r--r-- | docs/components/utilities.md | 24 |
1 files changed, 11 insertions, 13 deletions
diff --git a/docs/components/utilities.md b/docs/components/utilities.md index 563e4b7f6..a07e2de9e 100644 --- a/docs/components/utilities.md +++ b/docs/components/utilities.md @@ -10,7 +10,7 @@ Bootstrap includes dozens of utilities—classes with a single purpose. They're * Will be replaced with the ToC, excluding the "Contents" header {:toc} -### Text alignment +## Text alignment Easily realign text to components with text alignment classes. @@ -22,7 +22,7 @@ Easily realign text to components with text alignment classes. <p class="text-nowrap">No wrap text.</p> {% endexample %} -### Text transform +## Text transform Transform text in components with text capitalization classes. @@ -32,9 +32,7 @@ Transform text in components with text capitalization classes. <p class="text-capitalize">Capitalized text.</p> {% endexample %} -### Contextual colors - -### Contextual colors and backgrounds +## Contextual colors and backgrounds Convey meaning through color with a handful of emphasis utility classes. These may also be applied to links and will darken on hover just like our default link styles. @@ -69,7 +67,7 @@ Sometimes contextual classes cannot be applied due to the specificity of another Ensure that any meaning conveyed through color is also conveyed in a format that is not purely presentational. {% endcallout %} -### Close icon +## Close icon Use a generic close icon for dismissing content like modals and alerts. **Be sure to include screen reader text when you can** as we've done with `.sr-only`. @@ -80,7 +78,7 @@ Use a generic close icon for dismissing content like modals and alerts. **Be sur </button> {% endexample %} -### Floats +## Floats Float an element to the left or right with a class. `!important` is included to avoid specificity issues. Classes can also be used as mixins. @@ -107,7 +105,7 @@ Float an element to the left or right with a class. `!important` is included to } {% endhighlight %} -### Center content +## Center content Set an element to `display: block;` and center via `margin`. Available as a mixin and class. @@ -154,7 +152,7 @@ Easily clear `float`s by adding `.clearfix` **to the parent element**. Utilizes } {% endhighlight %} -### Hidden content +## Hidden content Hide any HTML element with the `[hidden]` attribute. Previously, v3.x included a `.hidden` class that forced toggled content. However, we removed it due to conflicts with jQuery's `hide()` function. It's taken from [PureCSS](http://purecss.io). @@ -164,7 +162,7 @@ Furthermore, `.invisible` can be used to toggle the visibility of an element, me <input type="text" hidden> {% endhighlight %} -### Invisible content +## Invisible content The `.invisible` class can be used to toggle only the visibility of an element, meaning its `display` is not modified and the element can still affect the flow of the document. @@ -184,7 +182,7 @@ The `.invisible` class can be used to toggle only the visibility of an element, } {% endhighlight %} -### Screen readers +## Screen readers Hide an element to all devices **except screen readers** with `.sr-only`. Combine `.sr-only` with `.sr-only-focusable` to show the element again when it's focused (e.g. by a keyboard-only user). Necessary for following [accessibility best practices](../getting-started/#accessibility). Can also be used as mixins. @@ -200,7 +198,7 @@ Hide an element to all devices **except screen readers** with `.sr-only`. Combin } {% endhighlight %} -### Image replacement +## Image replacement Utilize the `.text-hide` class or mixin to help replace an element's text content with a background image. @@ -215,7 +213,7 @@ Utilize the `.text-hide` class or mixin to help replace an element's text conten } {% endhighlight %} -### Responsive embeds +## Responsive embeds Allow browsers to determine video or slideshow dimensions based on the width of their containing block by creating an intrinsic ratio that will properly scale on any device. |
