From 98368c0ccae4cbcc80b322b996e08ec2b9740c14 Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Thu, 15 Aug 2013 13:24:48 -0700 Subject: fixes #9632: button spacing in narrow viewports --- components.html | 312 +++++++++++++++++++++++++++++--------------------------- 1 file changed, 159 insertions(+), 153 deletions(-) (limited to 'components.html') diff --git a/components.html b/components.html index c6a670a63..71b4f836f 100644 --- a/components.html +++ b/components.html @@ -160,34 +160,40 @@ base_url: "../"

Button group sizing

Instead of applying button sizing classes to every button in a group, just add .btn-group-* to the .btn-group.

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

Nested button groups

@@ -324,68 +330,66 @@ base_url: "../"

Single button dropdowns

Turn a button into a dropdown toggle with some basic markup changes.

-
-
- - -
-
- - -
-
- - -
-
- - -
-
- - -
-
- - -
-
+
+ + +
+
+ + +
+
+ + +
+
+ + +
+
+ + +
+
+ + +
{% highlight html %} @@ -406,74 +410,72 @@ base_url: "../"

Split button dropdowns

Similarly, create split button dropdowns with the same markup changes, only with a separate button.

-
-
- - - -
-
- - - -
-
- - - -
-
- - - -
-
- - - -
-
- - - -
-
+
+ + + +
+
+ + + +
+
+ + + +
+
+ + + +
+
+ + + +
+
+ + + +
{% highlight html %} @@ -495,7 +497,7 @@ base_url: "../"

Works with all button sizes

Button dropdowns work with buttons of all sizes.

-
+
+
+
+
+