Style bootstrap dropdown button input text

Question

I have a small issue with Twitter Bootstrap's dropdown buttons. I noticed that although it is possible to style the size of the buttons via .btn-large, .btn-small etc, the text style inside the dropdown does not change. For that matter, there doesn't seem to be any preset classes for text sizes other than headings and the small tag.

Is there any way I can change the style of the dropdown list to fit the button via the bootstrap classes (so small buttons get small text, mini buttons get mini text etc)? This must surely be an easy question yet I haven't been able to find a solution so far.

C3roe · Accepted Answer · 2013-05-22 10:57:06Z

1

The font-size for the dropdown ul elements is set using the selector

.btn-group > .btn, .btn-group > .dropdown-menu, .btn-group > .popover { ... }

so it is not dependent on the button size; and the ul themselves are not given a class that corresponds to the button size class.

But you can select the list that follows a button with a specific class and set your own font-size, like this:

.btn-group > .btn-small ~ .dropdown-menu {
  font-size:10px;
}

edited May 22, 2013 at 10:57

answered May 22, 2013 at 8:13

C3roe

97.8k15 gold badges100 silver badges172 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

C3roe Over a year ago

Oops, don’t know how that even got in there … updated my answer, thanks for the feedback!

Collectives™ on Stack Overflow

Style bootstrap dropdown button input text

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related