Form field sizing

[WinterSilence]

Prerequisites

• I have searched for duplicate or closed feature requests
• I have read the contributing guidelines

Proposal

1. checkbox/switch, radio, range inputs and textareas don't have sizing classes as form-control-sm and form-control-lg.
   grouply:

<div class="form-check form-check-sm mb-3">
  <!-- + "form-check-input-sm" -->
  <input class="form-check-input" type="checkbox" id="remember-me">
  <!-- + "form-check-label-sm" -->
  <label class="form-check-label" for="remember-me">Remember me</label>
</div>

or directly:

<div class="form-check mb-3">
  <input class="form-check-input form-check-input-sm" type="checkbox" id="remember-me">
  <label class="form-check-label form-check-label-sm" for="remember-me">Remember me</label>
</div>

2. input color with sizing class form-control-* have wrong height: <input type="color" class="form-control form-control-sm form-control-color"> - 35px, <input type="text" class="form-control form-control-sm"> - 31px
3. input width (css width, min-width and max-width) by attributes minlength, maxlength or size: if maxlength="250" is width:100%, then maxlength="100" is width:40% i.e. 100 / (250 / 100) or by size(step size: 10): input[size="10"] is input{min-width:10em;}, input[size="20"] is input{min-width:20em;}
4. There are no classes that allow to set size for all controls, labels and buttons in form/fieldset by default like as:

<!-- class "form-sm" similar to adding classes to elements: -->
<form class="form-sm">
  <div class="row mb-3">
    <!-- + "col-form-label-sm" -->
    <label for="email" class="col-2 col-form-label">Email</label>
    <div class="col-10">
      <!-- + "form-control-sm" -->
      <input type="email" class="form-control" id="email">
    </div>
  </div>
  <div class="row mb-3">
    <!-- + "col-form-label-sm" -->
    <label for="password" class="col-2 col-form-label">Password</label>
    <div class="col-10">
      <!-- + "form-control-sm" -->
      <input type="password" class="form-control" id="password">
    </div>
  </div>
  <!-- + "btn-sm" -->
  <button type="submit" class="btn btn-primary">Sign in</button>
</form>

Motivation and context

1. Setting size for any control, label or button in form
2. Setting size for inner controls, labels and buttons by container(form/fieldset/row) class

[mdo]

1. Checks, radios, and switches are sized with font-size. Annoying in some respects, but also a nice convenience IMO. We'll stick with that for now.
2. Good callout, I've opened Update .form-control-color sizing and styles #36156 to address that.
3. I see what you're going for, but using we'll stick to explicit width dimensions for sizing inputs. minlength and maxlength affect the number of characters within an input, not it's size. size is interesting, but going by character count when variable fonts across browsers and devices is a recipe for some difficult inconsistencies.
4. No plans to add form-wide sizing.

[WinterSilence]

4. why? set form size(.form-sm) and customize some controls(.form-control-md) are shortest and easy than sets sizes for all controls in form(.form-control-sm/.form-control-md, .form-label-sm/.form-label-md)

[David-Baron]

Sorry, I missed your answers. When you have a design, it is (usually) the same for the whole form. When you have a form with 50 inputs/labels, it would be better to have a general style in the form tag. This was just an idea, but if it doesn't please anyone...sorry for the inconvenience.