white line below the email field custom css

I put the following code in the custom css to show the pink background on error.

.form-line-error {
  background-color: #FFF4F4 !important;
}

For some reason there is a white line below the "Your Email" field. I guess the div isn't tall enough. I've tried different css to fix it but can't seem to figure it out.

It is the FVHL Meet Our Team form.

This may need to go on a different thread. Not sure.

Any advice would be appreciated.

I have checked your form and it seems that the background color doesn't cover all the area in the email field.

You may add height in your form-line-error to expand the background color.

.form-line-error {
  background-color: #FFF4F4 !important;
  height:100px;

}

Please give it a try and let us know how it goes.

Thank you.

That worked on the email field but introduced another problem. Now the background for the textarea is not covered completely.

This is before adding the

.form-line-error {
  background-color: #FFF4F4 !important;
  height: 100px;
}

This is after...

I think we need to change our approach on the CSS. Instead of targeting the form line error CSS, we can try to target the email field instead.

We can adjust the height of the field to fix the issue.

Kindly remove the height code I have  added above and add this CSS code instead.

#id_15{
height:85px;
}

Thank you.

That worked like a charm Richie! Thank you very much!