elementos input com tamanhos diferentes

28/03/2022

0

Bom dia pessoal!
Tudo bem?

Sou iniciante em bootstrap, poderiam me ajudar com um problema?

Em uma página html criei uma lista onde em cada item tem um label e um input.
O problema é que o comprimento de cada input fica proporcional ao tamanho do label.

Saberiam me dizer uma forma de corrigir isso?

Preciso que o comprimento dos inputs sejam sempre uniformes entre eles.

Segue o trecho do html:

" <form class="needs-validation" novalidate>

<ul id="relacao" class="list-group mb-3">

<li id="li001" class="list-group-item d-flex justify-content-between lh-condensed">
<div class="mb-3">
<h6 class="my-0">010005 - PC</h6>
<small class="text-muted">PLACA NEUTRALIZADORA PARA MICT C/PEDRA UN MILC</small><br><br>
<div class="input-group input-group-sm mb-3">
<div class="input-group-prepend">
<span class="input-group-text" id="inputGroup-sizing-sm">Contagem:</span>
</div>
<input type="number" id="cnt0001" inputmode="numeric" class="form-control" min="0" required aria-label="Exemplo do tamanho do input" aria-describedby="inputGroup-sizing-sm">
<div class="invalid-feedback">
É obrigatório inserir uma quantidade, nem que seja zero.
</div>
</div>
</div>
</li>

<li id="li002" class="list-group-item d-flex justify-content-between lh-condensed">
<div class="mb-3">
<h6 class="my-0">010010 - UN</h6>
<small class="text-muted">REFIL PARA FORRO DE ASSENTO SANITARIO 40UN </small><br><br>
<div class="input-group input-group-sm mb-3">
<div class="input-group-prepend">
<span class="input-group-text" id="inputGroup-sizing-sm">Contagem:</span>
</div>
<input type="number" id="cnt0002" inputmode="numeric" width="48" class="form-control" min="0" required aria-label="Exemplo do tamanho do input" aria-describedby="inputGroup-sizing-sm">
<div class="invalid-feedback">
É obrigatório inserir uma quantidade, nem que seja zero.
</div>
</div>
</div>
</li>

<li id="li003" class="list-group-item d-flex justify-content-between lh-condensed">
<div class="mb-3">
<h6 class="my-0">010011 - CX</h6>
<small class="text-muted">RESERVATORIO P/ SABONETEIRA ABS - MILCLEAN</small><br><br>
<div class="input-group input-group-sm mb-3">
<div class="input-group-prepend">
<span class="input-group-text" id="inputGroup-sizing-sm">Contagem:</span>
</div>
<input type="number" id="cnt0003" inputmode="numeric" width="48" class="form-control" min="0" required aria-label="Exemplo do tamanho do input" aria-describedby="inputGroup-sizing-sm">
<div class="invalid-feedback">
É obrigatório inserir uma quantidade, nem que seja zero.
</div>
</div>
</div>
</li>

</ul>

<hr class="mb-4">
<button class="btn btn-primary btn-lg btn-block" type="submit">Enviar Inventário</button>

</form> "
Denis Barros

Denis Barros

Responder

Que tal ter acesso a um e-book gratuito que vai te ajudar muito nesse momento decisivo?

Ver ebook

Recomendado pra quem ainda não iniciou o estudos.

Eu quero
Ver ebook

Recomendado para quem está passando por dificuldades nessa etapa inicial

Eu quero

Utilizamos cookies para fornecer uma melhor experiência para nossos usuários, consulte nossa política de privacidade.

Aceitar