Buen día!
Les comento.. soy nuevo utilizando Bootstrap 4 y estoy intentando, dentro de un formulario, poner en un mismo renglón varios input de la clase input-group
.
Estoy intentando lo siguiente:
<div class="row">
<label for="uno">Primer Label</label>
<div class="input-group col-4 mb-3">
<div class="input-group-prepend">
<span class="input-group-text" id="basic-addon34">https://example.com/users/</span>
</div>
<input type="text" class="form-control" id="uno" aria-describedby="basic-addon3">
</div>
<label for="basic-url">Segundo Label</label>
<div class="input-group col-4 mb-3">
<div class="input-group-prepend">
<span class="input-group-text" id="basic-addon3">https://example.com/users/</span>
</div>
<input type="text" class="form-control" id="basic-url" aria-describedby="basic-addon3">
</div>
</div>
Lo que pasa, es que el <Label>
se posiciona a la izquierda del <input>
cuando lo que pretendo es que se posicione arriba, como pasa usando la clase .form-row
Intenté probando distintas combinaciones y buscando en internet y no tuve suerte!
¿Alguien sabe cual sería la manera correcta para hacerlo?
Aclaro, que no utilizo form-inline
ya que es un formulario bastante largo (+30 inputs), donde en ciertos casos muestro 2 o 3 en un mismo renglón, pero se da la situación en la que tengo que aclarar la medida, por lo cual me veo obligado a utilizar un input-group
Desde ya muchísimas gracias por leer la pregunta!