css - Bootstrap 验证消息正在下推我的表单的其余部分

Question

我在 CodePen 中创建了一个简单的表单. name 字段上的 required 验证工作得很好。但是，我想在两个字段之间添加一些填充，当错误消息应该显示时...填充该空白(意思是，错误消息出现的下面的字段不会被下推)。相反，它会不断下推字段以为错误腾出空间。修复错误后，该字段将被拉回。

我想要这样的东西:

我已经尝试设置 .errorMessage 的位置，但这没有任何改变。

.errorMessage{
        position: relative;
        //position: absolute;  <--I've tried this, too
    }

我做错了什么？

Answer 1

查看此代码笔:http://codepen.io/Sky-123/pen/QKoLEz

在 css 中做了轻微的变通:

div.form-group{
  margin-bottom:35px
}

div.has-error{
 height:0px 
}