From 44a4e7121534a4aeb74ac260e17ee536457449f9 Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Fri, 26 Jul 2013 22:03:52 -0700 Subject: [PATCH] Fix clipped dropdowns in input groups section of docs --- assets/css/docs.css | 3 - css.html | 281 ++++++++++++++++++++++++-------------------- 2 files changed, 152 insertions(+), 132 deletions(-) diff --git a/assets/css/docs.css b/assets/css/docs.css index 8843d2480f..243c922f1e 100644 --- a/assets/css/docs.css +++ b/assets/css/docs.css @@ -418,9 +418,6 @@ body { .bs-example-control-sizing input[type="text"] + input[type="text"] { margin-top: 10px; } -.bs-example-form { - overflow: hidden; -} .bs-example-form .input-group { margin-bottom: 10px; } diff --git a/css.html b/css.html index 9aa5c6ca42..9e7da28f98 100644 --- a/css.html +++ b/css.html @@ -1545,34 +1545,34 @@ For example, <section> should be wrapped as inline.
-
+
@

-
+
.00

-
+
$ .00
{% highlight html %} -
+
@
-
+
.00
-
+
$ .00 @@ -1582,33 +1582,33 @@ For example, <section> should be wrapped as inline.

Optional sizes

Add the relative form sizing classes to the .input-group-addon.

-
+
@

-
+
@

-
+
@
{% highlight html %} -
+
@
-
+
@
-
+
@
@@ -1617,144 +1617,167 @@ For example, <section> should be wrapped as inline.

Buttons instead of text

Buttons in input groups are a bit different and require one extra level of nesting. Instead of .input-group-addon, you'll need to use .input-group-btn to wrap the buttons. This is required due to default browser styles that cannot be overridden.

-
- - - - -
-
-
- - - - -
+
+
+
+ + + + +
+
+
+
+ + + + +
+
+
{% highlight html %} -
- - - - -
- -
- - - - -
+
+
+
+ + + + +
+
+
+
+ + + + +
+
+
{% endhighlight %}

Button dropdowns

-
-
- - -
- -
-
-
- -
- - -
-
+
+
+
+
+ + +
+ +
+
+
+
+ +
+ + +
+
+
+
{% highlight html %} -
-
- - -
- -
- -
- -
- - -
-
+
+
+
+
+ + +
+ +
+
+
+
+ +
+ + +
+
+
+
{% endhighlight %}

Segmented dropdown groups

-
-
- - - -
- -
- -
- -
- -
- - - -
-
+
+
+
+
+ + + +
+ +
+
+
+
+ +
+ + + +
+
+
+
{% highlight html %} -
+
-
+