Thanks to visit codestin.com
Credit goes to github.com

Skip to content

input-size is generating different CSS than I would expect #15074

Description

@caleb

I'm using bootstrap-sass and in that version control sizing doesn't work (e.g. form-group-sm or form-group-lg etc, see twbs/bootstrap-sass#763)

Looking into what is causing this led me to the Less version of bootstrap, and I think something is wrong with the input-size mixin and how it's being used. While the Sass version is broken, and I think the Less version works, I believe the Less version isn't generating the intended CSS.

The less code from forms.less (https://github.com/twbs/bootstrap/blob/master/less/forms.less#L315):

.input-lg,
.form-group-lg .form-control {
  .input-size(@input-height-large; @padding-large-vertical; @padding-large-horizontal; @font-size-large; @line-height-large; @input-border-radius-large);
}

Generates this CSS code:

…
textarea.input-sm,
textarea.form-group-sm .form-control,
select[multiple].input-sm,
select[multiple].form-group-sm .form-control {
  height: auto;
}
…

That doesn't look like the intended CSS. I would expect this:

…
textarea.input-sm,
.form-group-sm textarea.form-control,
select[multiple].input-sm,
.form-group-sm select[multiple].form-control {
  height: auto;
}
…

Is this wrong? I would be interested in trying to create a patch if it is.

-Caleb

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Fields

    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions