From b505c8557d4145b38257fc51d6ca4e7d98a0b62c Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Sun, 22 Dec 2013 22:07:01 -0800 Subject: fixes #11961: dropdown alignment docs improvements --- components.html | 8 ++++++-- 1 file changed, 6 insertions(+), 2 deletions(-) (limited to 'components.html') diff --git a/components.html b/components.html index b511f46a0..3bdf2df79 100644 --- a/components.html +++ b/components.html @@ -107,8 +107,12 @@ base_url: "../" {% endhighlight %} - -

Add .dropdown-menu-right to a .dropdown-menu to right align the dropdown menu.

+ +

By default, a dropdown menu is automatically positioned 100% from the top and along the left side of its parent. Add .dropdown-menu-right to a .dropdown-menu to right align the dropdown menu.

+
+

May require additional positioning

+

Dropdowns are automatically positioned via CSS within the normal flow of the document. This means dropdowns may be cropped by parents with certain overflow properties or appear out of bounds of the viewport. Address these issues on your own as they arise.

+

Deprecated .pull-right alignment

As of v3.1, we've deprecated .pull-right on dropdown menus. To right-align a menu, use .dropdown-menu-right. Right-aligned nav components in the navbar use a mixin version of this class to automatically align the menu. To override it, use .dropdown-menu-left.

-- cgit v1.2.3 From 71e9db41834ae1f9873e4047033f868be5e98036 Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Mon, 23 Dec 2013 20:28:21 -0800 Subject: add callout about justified button group borders to address #11964 --- components.html | 5 +++++ 1 file changed, 5 insertions(+) (limited to 'components.html') diff --git a/components.html b/components.html index 3bdf2df79..cd38f85eb 100644 --- a/components.html +++ b/components.html @@ -371,6 +371,11 @@ base_url: "../"

Justified link variation

Make a group of buttons stretch at the same size 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.

+
+

Element-specific usage

This only works with <a> elements as the <button> doesn't pick up the styles we use to justify content (some display: table-cell;-fu).

-- cgit v1.2.3 From d43eb0a513abf19c4c49b9cf7e2d56db6239fafb Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Thu, 26 Dec 2013 19:37:19 -0800 Subject: less fun to address #12008 --- components.html | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) (limited to 'components.html') diff --git a/components.html b/components.html index cd38f85eb..15dda2a92 100644 --- a/components.html +++ b/components.html @@ -2151,7 +2151,7 @@ body { padding-bottom: 70px; } Heads up! This alert needs your attention, but it's not super important.
- Warning! Best check yo self, you're not looking too good. + Warning! Better check yourself, you're not looking too good.
Oh snap! Change a few things up and try submitting again. @@ -2169,13 +2169,13 @@ body { padding-bottom: 70px; }
- Warning! Best check yo self, you're not looking too good. + Warning! Better check yourself, you're not looking too good.
{% highlight html %}
- Warning! Best check yo self, you're not looking too good. + Warning! Better check yourself, you're not looking too good.
{% endhighlight %} @@ -2194,7 +2194,7 @@ body { padding-bottom: 70px; } Heads up! This alert needs your attention, but it's not super important.
- Warning! Best check yo self, you're not looking too good. + Warning! Better check yourself, you're not looking too good.
Oh snap! Change a few things up and try submitting again. -- cgit v1.2.3