Si observan el ejemplo en una resolución de 1024p podrán observar como el texto del label
se extiende y el select
pegado a la parte superior del div que le corresponde a el.
Acá el ejemplo de mi form
:
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
<form class="form-horizontal" role="form" id="">
<div class="form-group col-xs-12 col-sm-12 col-lg-12 col-md-12">
<label for="editar_pro" class="control-label col-xs-2 col-sm-2 col-lg-2 col-md-2">Lineas de Producción Tales como Liquidos, Esteriles, Solidos, Etc...: </label>
<div class="col-xs-10 col-sm-10 col-lg-10 col-md-10">
<select id="" class="form-control" name="" style="width: 100%;"></select>
</div>
</div>
</form>
<script src="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/js/bootstrap.min.js" type="text/javascript"></script>
Veo un ejemplo que conseguí pero funciona con bootstrap 4. Fuente aquí
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<link href="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0-alpha.6/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
<div class="container">
<form class="form-horizontal" role="form" id="">
<div class="row align-items-center">
<label for="" class="control-label col-2 col-sm-2 col-md-2 col-lg-2 col-xl-2">Lineas de Producción Tales como Liquidos, Esteriles, Solidos, Etc...: </label>
<div class=" col-10 col-sm-10 col-md-10 col-lg-10 col-xl-10">
<select id="" class="form-control" name="" style="width: 100%;"></select>
</div>
</div>
</form>
</div>
<script src="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0-alpha.6/js/bootstrap.min.js" type="text/javascript"></script>