引导表单，当显示jquery.validation.js通知时，避免输入向下移动

Question

所以我有一个带引导输入的表单，即时通讯使用jquery.validation.js库，因此，它正常工作，就是当显示错误通知时，输入字段和标签向下移动。例如：

这是他正常状态下的表格：

这是显示这些消息的表单，因为您可以看到输入字段和标签向下移动。

Answer 1

我看不到屏幕截图中的标签或输入向下移动。但无论如何，为什么不在输入字段下面包裹div或span并让它占用固定的空间量。然后在没有DOM调整的情况下显示通知。

Answer 2

您可以为每个输入使用一行，例如：

<div class="row col-md-12"> 

         <div class="col-md-4">  
                        <div class="input-group">
                          <label for="numero">Número de Calle </label> 
                          <input type="number" class="form-control" id="numero" name="numero" placeholder="Número de calle" v-model="documento.rev_nrocalle" v-validate:numero="{required: true, maxlength: 4 }" autocomplete="off" required>
                          <small class="help-block" style="">  <span class="animated" transition="fade"  v-show="$validaciones.numero.required && formIsInvalid"><strong>Introducir un número de calle válido </strong></span></small>
                        </div> 

                    </div> 
</div>

这是方法，以避免在我的情况下使用vue.js验证