From ea407666ce3c5d708b4a830fb2d00bdcb0d2d53e Mon Sep 17 00:00:00 2001 From: Chris Rebert Date: Tue, 11 Nov 2014 20:23:49 -0800 Subject: give all docs callouts IDs [skip sauce] --- docs/_includes/components/button-groups.html | 14 +++++++------- 1 file changed, 7 insertions(+), 7 deletions(-) (limited to 'docs/_includes/components/button-groups.html') diff --git a/docs/_includes/components/button-groups.html b/docs/_includes/components/button-groups.html index 4a1fc86f8..a68856e17 100644 --- a/docs/_includes/components/button-groups.html +++ b/docs/_includes/components/button-groups.html @@ -3,12 +3,12 @@

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.

-
+

Tooltips & popovers in button groups require special setting

When using tooltips or popovers on elements within a .btn-group, you'll have to specify the option container: 'body' to avoid unwanted side effects (such as the element growing wider and/or losing its rounded corners when the tooltip or popover is triggered).

-
+

Ensure correct role and provide a label

In order for assistive technologies – such as screen readers – to convey that a series of buttons is grouped, an appropriate role attribute needs to be provided. For button groups, this would be role="group", while toolbars should have a role="toolbar".

One exception are groups which only contain a single control (for instance the justified button groups with <button> elements) or a dropdown.

@@ -190,11 +190,11 @@

Justified button groups

Make a group of buttons stretch at equal sizes to span the entire width of its parent. Also works with button dropdowns within the button group.

-
+

Handling borders

Due to the specific HTML and CSS used to justify buttons (namely display: table-cell), the borders between them are doubled. In regular button groups, margin-left: -1px is used to stack the borders instead of removing them. However, margin doesn't work with display: table-cell. As a result, depending on your customizations to Bootstrap, you may wish to remove or re-color the borders.

-
+

IE8 and borders

Internet Explorer 8 doesn't render borders on buttons in a justified button group, whether it's on <a> or <button> elements. To get around that, wrap each button in another .btn-group.

See #12476 for more information.

@@ -232,9 +232,9 @@
{% endhighlight %} -
-

Links acting as buttons

-

If the <a> elements are used to act as buttons – triggering in-page functionality, rather than navigating to another document or section within the current page – they should also be given an appropriate role="button".

+
+

Links acting as buttons

+

If the <a> elements are used to act as buttons – triggering in-page functionality, rather than navigating to another document or section within the current page – they should also be given an appropriate role="button".

With <button> elements

-- cgit v1.2.3