<div class="form-group"> <label class="col-sm-3 control-label">Charges</label> <div class="col-sm-9"> <div class="checkbox"> {foreach from=$charges_list item=item} <div class="form-group row"> <div class="col-sm-3"> <input type="checkbox" name="ch[]" value="{$item.id}" data-amount="{$item.amount}" class="form-check-input" /> <input type="text" name="charge_amount[{$item.id}]" class="form-control form-control-sm" /> </div> <div class="col-md-9"> {$item.value} </div> </div> {/foreach} </div> </div>

PS I want to make a small input .

  • and how should it work? - stackanon
  • I want to do a little input - Jonny Manowar
  • you need a class input-sm . Replace form-control-sm with input-sm - stackanon
  • Thank you) Earned) Although the documentation was like this: <input type = "email" class = "form-control form-control-sm" id = "smFormGroupInput" Manowar

2 answers 2

Try this: form-control input-sm

 <input type="text" name="charge_amount[{$item.id}]" class="form-control input-sm" />

    Because the mentioned class is mentioned in Bootstrap 4th version , which is now in active development and did not come out of the alpha version.

    You are connecting, most likely, Bootstrap 3rd version, in which the class is called
    .input-sm , not .form-control-sm .

    Here is an example with the connected 4th version and your class:

     <link href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.2/css/bootstrap.min.css" rel="stylesheet"/> <div class="container"> <form> <div class="form-group row"> <label for="lgFormGroupInput" class="col-sm-2 col-form-label col-form-label-lg"><small>Обычный input</small></label> <div class="col-sm-10"> <input type="email" class="form-control form-control-lg" id="lgFormGroupInput" placeholder="you@example.com"> </div> </div> <div class="form-group row"> <label for="smFormGroupInput" class="col-sm-2 col-form-label col-form-label-sm"><small>Мелкий input</small></label> <div class="col-sm-10"> <input type="email" class="form-control form-control-sm" id="smFormGroupInput" placeholder="you@example.com"> </div> </div> </form> </div>