2
0
mirror of https://github.com/tenrok/bootstrap.git synced 2026-06-14 18:42:30 +03:00

Change how input and select height is computed

— Previously we weren't including the border-width on the computed height, leading to alignment issues.

— New system utilizes three variables (not ideal, but straightforward) for computing these heights. One for the vertical border, one for the line-height/font-size/padding dance, and one to add those together.

— Updates CSS across forms and custom forms to use new sizing. Special note here: form validation icon sizing uses the inner variables because background-image doesn't bleed into borders unless explicit background-clip.
This commit is contained in:
Mark Otto
2017-04-22 11:56:01 -07:00
parent 80438e93e1
commit dc3af6711d
3 changed files with 17 additions and 13 deletions
+1 -2
View File
@@ -133,8 +133,7 @@
.custom-select {
display: inline-block;
max-width: 100%;
$select-border-width: ($custom-select-border-width * 2);
height: calc(#{$input-height} + #{$select-border-width});
height: $input-height;
padding: $custom-select-padding-y ($custom-select-padding-x + $custom-select-indicator-padding) $custom-select-padding-y $custom-select-padding-x;
line-height: $custom-select-line-height;
color: $custom-select-color;