diff options
author | Chris Rebert <chris.rebert@hulu.com> | 2013-06-26 07:18:30 +0400 |
---|---|---|
committer | Chris Rebert <chris.rebert@hulu.com> | 2013-06-26 07:18:30 +0400 |
commit | 242d92e09c60396bad0837581a9692bf7abe8aea (patch) | |
tree | 50bca2eb7cbef5d8a093a2547c8163d6e78cec27 /docs | |
parent | cc43ba35d7c1bb4663a8aea4eb0ba3a97d782852 (diff) |
Fix #8287
Diffstat (limited to 'docs')
-rw-r--r-- | docs/components.html | 5 | ||||
-rw-r--r-- | docs/css.html | 6 | ||||
-rw-r--r-- | docs/javascript.html | 13 |
3 files changed, 19 insertions, 5 deletions
diff --git a/docs/components.html b/docs/components.html index 55f27cbc33..bbb2c0f557 100644 --- a/docs/components.html +++ b/docs/components.html @@ -482,6 +482,11 @@ lead: "Dozens of reusable components built to provide iconography, dropdowns, na </div> <p class="lead">Group a series of buttons together on a single line with the button group. Add on optional JavaScript radio and checkbox style behavior with <a href="./javascript.html#buttons">our buttons plugin</a>.</p> + <div class="bs-callout"> + <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> + <h3 id="btn-groups-single">Basic button group</h3> <p>Wrap a series of buttons with <code>.btn</code> in <code>.btn-group</code>.</p> <div class="bs-example"> diff --git a/docs/css.html b/docs/css.html index 2f7d747085..8e7b57d379 100644 --- a/docs/css.html +++ b/docs/css.html @@ -1494,12 +1494,16 @@ For example, <code><section></code> should be wrapped as inline. <p>Adding on top of existing browser controls, Bootstrap includes other useful form components.</p> <h3 id="forms-input-groups">Input groups</h3> - <p>Add text or buttons before, after, or on both sides of any text-based input. Use <code>.input-group</code> with a <code>.add-on</code> to prepend or append elements to an <code><input></code>.</p> + <p>Add text or buttons before, after, or on both sides of any text-based input. Use <code>.input-group</code> with an <code>.add-on</code> to prepend or append elements to an <code><input></code>.</p> <div class="bs-callout"> <h4>Cross-browser compatibility</h4> <p>Avoid using <code><select></code> elements here as they cannot be fully styled in WebKit browsers.</p> </div> + <div class="bs-callout"> + <h4>Tooltips & popovers in input groups require special setting</h4> + <p>When using tooltips or popovers on elements within an <code>.input-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> <form class="bs-example bs-example-form"> <div class="input-group col-lg-9"> diff --git a/docs/javascript.html b/docs/javascript.html index 9a5a5b6f06..2580d9a6e1 100644 --- a/docs/javascript.html +++ b/docs/javascript.html @@ -744,9 +744,10 @@ $('a[data-toggle="tab"]').on('shown.bs.tab', function (e) { </ul> </div><!-- /example --> - - <h3>Tooltips in input groups</h3> - <p>When using tooltips and popovers with the Bootstrap input groups, you'll have to set the <code>container</code> (documented below) option to avoid unwanted side effects.</p> + <div class="bs-callout"> + <h4>Tooltips in button groups and input groups require special setting</h4> + <p>When using tooltips on elements within a <code>.btn-group</code> or an <code>.input-group</code>, you'll have to specify the option <code>container: 'body'</code> (documented below) to avoid unwanted side effects (such as the element growing wider and/or losing its rounded corners when the tooltip is triggered).</p> + </div> <hr class="bs-docs-separator"> @@ -873,6 +874,10 @@ $('#example').tooltip(options) <h4>Plugin dependency</h4> <p>Popovers require the <a href="#tooltips">tooltip plugin</a> to be included in your version of Bootstrap.</p> </div> + <div class="bs-callout"> + <h4>Popovers in button groups and input groups require special setting</h4> + <p>When using popovers on elements within a <code>.btn-group</code> or an <code>.input-group</code>, you'll have to specify the option <code>container: 'body'</code> (documented below) to avoid unwanted side effects (such as the element growing wider and/or losing its rounded corners when the popover is triggered).</p> + </div> <h3>Static popover</h3> <p>Four options are available: top, right, bottom, and left aligned.</p> @@ -1004,7 +1009,7 @@ $('#example').tooltip(options) <td>string | false</td> <td>false</td> <td> - <p>Appends the popover to a specific element <code>container: 'body'</code></p> + <p>Appends the popover to a specific element. Example: <code>container: 'body'</code></p> </td> </tr> </tbody> |