Skip to content
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

<select> element height differs from other form inputs when using custom line height #20977

Closed
maimairel opened this issue Oct 23, 2016 · 2 comments

Comments

@maimairel
Copy link

maimairel commented Oct 23, 2016

When compiling Bootstrap with line-height other than the default value, the select element's height slightly differs from other elements and buttons.

select element with default line height:
default line height

select element with 1.75 line height:
1.75 line height

Thanks!

@jesusmtzarvizu
Copy link

jesusmtzarvizu commented Nov 16, 2016

Just to confirm that I understand it , So the select element's height is the only element that change when you change the default value of line -height on you CSS Document??? Could paste some code when using line-height, please?

@maimairel
Copy link
Author

maimairel commented Nov 17, 2016

@jesusmtzarvizu Yes, the select element height's differs, because it is hardcoded in Bootstrap.

select.form-control {
  &:not([size]):not([multiple]) {
    $select-border-width: ($border-width * 2);
    height: calc(#{$input-height} - #{$select-border-width});
  }
}

@mdo mdo added this to the v4.0.0-alpha.6 milestone Nov 28, 2016
mdo added a commit that referenced this issue Dec 23, 2016
Turns out we did have the correct height calculation with our custom selects. The problem was we lacked a shared line-height with our buttons and inputs.

This restores the previous `calc` math and adds a line-height that reuses the input line-height.
mdo added a commit that referenced this issue Dec 24, 2016
Turns out we did have the correct height calculation with our custom selects. The problem was we lacked a shared line-height with our buttons and inputs.

This restores the previous `calc` math and adds a line-height that reuses the input line-height.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

3 participants