I created a simple form in CodePen. The required
validation on the name
field works just fine. However, I want to put a little bit of padding between the two fields and when the error message is supposed to display...fill in that gap (meaning, the fields below where the error message appears does not get pushed down). Instead, it keeps pushing the fields down to make room for the error. When the error is fixed, the field is pulled back up.
I want something like this:
I have tried setting the position of .errorMessage
but this changed nothing.
.errorMessage{
position: relative;
//position: absolute; <--I've tried this, too
}
What am I doing incorrectly?
Check out this code pen:http://codepen.io/Sky-123/pen/QKoLEz
Did slight workarounds in css:
div.form-group{
margin-bottom:35px
}
div.has-error{
height:0px
}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With