diff options
| author | Mark Otto <[email protected]> | 2015-04-16 14:07:20 -0700 |
|---|---|---|
| committer | Mark Otto <[email protected]> | 2015-04-16 14:07:20 -0700 |
| commit | c84cf4f7f5187e607e1c5a921d7a7b8166e66def (patch) | |
| tree | 8e4b6d63554fb3cbba79e3f89b0b31a4b21b779a /docs/components/button-group.md | |
| parent | 3c9368124507ce2d643a471e71b1ed13c9232435 (diff) | |
| download | bootstrap-c84cf4f7f5187e607e1c5a921d7a7b8166e66def.tar.xz bootstrap-c84cf4f7f5187e607e1c5a921d7a7b8166e66def.zip | |
rename classes from .bs-docs and .bs to .bd
Diffstat (limited to 'docs/components/button-group.md')
| -rw-r--r-- | docs/components/button-group.md | 8 |
1 files changed, 4 insertions, 4 deletions
diff --git a/docs/components/button-group.md b/docs/components/button-group.md index dbb7b1a33..3b90e61c9 100644 --- a/docs/components/button-group.md +++ b/docs/components/button-group.md @@ -5,12 +5,12 @@ title: Button group Group a series of buttons together on a single line with the button group. Add on optional JavaScript radio and checkbox style behavior with [our buttons plugin](../javascript/#buttons). -<div class="bs-callout bs-callout-warning"> +<div class="bd-callout bd-callout-warning"> <h4>Tooltips & popovers in button groups require special setting</h4> <p>When using tooltips or popovers on elements within a <code>.btn-group</code>, you'll have to specify the option <code>container: 'body'</code> to avoid unwanted side effects (such as the element growing wider and/or losing its rounded corners when the tooltip or popover is triggered).</p> </div> -<div class="bs-callout bs-callout-warning"> +<div class="bd-callout bd-callout-warning"> <h4>Ensure correct <code>role</code> and provide a label</h4> <p>In order for assistive technologies – such as screen readers – to convey that a series of buttons is grouped, an appropriate <code>role</code> attribute needs to be provided. For button groups, this would be <code>role="group"</code>, while toolbars should have a <code>role="toolbar"</code>.</p> <p>In addition, groups and toolbars should be given an explicit label, as most assistive technologies will otherwise not announce them, despite the presence of the correct <code>role</code> attribute. In the examples provided here, we use <code>aria-label</code>, but alternatives such as <code>aria-labelledby</code> can also be used.</p> @@ -55,7 +55,7 @@ Combine sets of button groups into button toolbars for more complex components. Instead of applying button sizing classes to every button in a group, just add `.btn-group-*` to each `.btn-group`, including each one when nesting multiple groups. -<div class="bs-example"> +<div class="bd-example"> <div class="btn-group btn-group-lg" role="group" aria-label="Large button group"> <button type="button" class="btn btn-secondary">Left</button> <button type="button" class="btn btn-secondary">Middle</button> @@ -113,7 +113,7 @@ Place a `.btn-group` within another `.btn-group` when you want dropdown menus mi Make a set of buttons appear vertically stacked rather than horizontally. **Split button dropdowns are not supported here.** -<div class="bs-example"> +<div class="bd-example"> <div class="btn-group-vertical" role="group" aria-label="Vertical button group"> <button type="button" class="btn btn-secondary">Button</button> <button type="button" class="btn btn-secondary">Button</button> |
