Skip to content

.form-control-{sm,lg} height sizing classes don't work on <select>s #19771

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
delakanda opened this issue Apr 20, 2016 · 8 comments
Closed

.form-control-{sm,lg} height sizing classes don't work on <select>s #19771

delakanda opened this issue Apr 20, 2016 · 8 comments

Comments

@delakanda
Copy link

delakanda commented Apr 20, 2016

i am trying to apply the class form-control-sm to make my select element smaller. it doesnt seem to work.
i tried form-control-lg too and there is no visual change.

@cvrebert
Copy link
Collaborator

@delakanda
What browser and OS are you using?
Please post a JS Bin that demonstrates the problem.

@delakanda
Copy link
Author

delakanda commented Apr 21, 2016

@cvrebert
I am using google chrome Version 50.0.2661.75 (64-bit) on ubuntu 15.10

here is the JS bin link:
https://jsbin.com/walamozoxa/edit?html,output

It however seems that the form-control-sm class only seems to affect the text inside the 'select' eleme nt and not the size of the element itself

@twbs-lmvtfy
Copy link

Hi @delakanda!

You appear to have posted a live example (https://jsbin.com/vacadozega/edit), which is always a good first step. However, according to the HTML5 validator, your example has some validation errors, which might potentially be causing your issue:

  • line 12, column 7 thru column 26: The name attribute on the option element is obsolete. Use the id attribute instead.
  • line 13, column 7 thru column 31: The name attribute on the option element is obsolete. Use the id attribute instead.
  • line 14, column 7 thru column 32: The name attribute on the option element is obsolete. Use the id attribute instead.

You'll need to fix these errors and post a revised example before we can proceed further.
Thanks!

(Please note that this is a fully automated comment.)

@cvrebert
Copy link
Collaborator

Reposting to trigger revalidation: https://jsbin.com/walamozoxa/edit?html,output

@twbs-lmvtfy
Copy link

Hi @cvrebert!

You appear to have posted a live example (https://jsbin.com/walamozoxa/edit), which is always a good first step. However, according to Bootlint, your example has some Bootstrap usage errors, which might potentially be causing your issue:

  • W002: <head> is missing X-UA-Compatible <meta> tag that disables old IE compatibility modes

You'll need to fix these errors and post a revised example before we can proceed further.
Thanks!

(Please note that this is a fully automated comment.)

@cvrebert
Copy link
Collaborator

Okay, that particular warning should be safe to ignore.

@cvrebert cvrebert changed the title form-control-sm class applied to a select element does not work .form-control-{sm,lg} height sizing classes don't work on <select>s Apr 21, 2016
@cvrebert cvrebert added this to the v4.0.0-alpha.3 milestone Apr 21, 2016
@cvrebert
Copy link
Collaborator

Possible cause: #17194 (comment)

@mdo
Copy link
Member

mdo commented May 9, 2016

Tacked onto #19141.

@mdo mdo closed this as completed May 9, 2016
This was referenced May 9, 2016
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

4 participants