Contact Form not Displaying Properly

• 

  howardpublicschool · Member · Sep 12, 2013 at 12:50 am

  • Copy link
  • Add topic to favorites

  I’ve just noticed that the contact forms on my pages are not displaying inputted text properly.

  http://howardpublicschool.com/about/6-2/
  http://howardpublicschool.com/get-involved/volunteer-opportunities/
  http://howardpublicschool.com/school-fundraising/fall-fete/

  When you go to enter your name or e-mail the text disappears as you move to the next box.

  The form is working – the info gets transmitted – but because it doesn’t display properly I worry it will discourage people from using the forms.

  The theme I am using is Misty Lake, and I have the custom CSS upgrade.

  Thanks in advance.

  The blog I need help with is: (visible only to logged in users)

• 

  jcasta · Member · Sep 12, 2013 at 5:48 am

  • Copy link

  The CSS rule that is causing it:

  input[type="text"],
  input[type="email"],
  textarea {
      color: #FFFFFF;
  }

  Since the background color is also set to white the text ‘disappears’ when it’s not active, selected. :)

• 

  howardpublicschool · Member · Sep 12, 2013 at 2:26 pm

  • Copy link

  Thank you for the response @jcasta
  I see what you’re saying. It’s there, it’s just invisible because the colour is white.

  Problem is…I’m not sure where to put the CSS coding that you have provided. Is there a way to change only the font colour (black would be fine) in those input forms rather than on the whole site?

• 

  jcasta · Member · Sep 19, 2013 at 10:08 am

  • Copy link

  Sorry for the delay in response. :(

  What you can do is actually just change the color value from the code I just posted to any color of your choosing.

  Or you could try using:

  .contact-form input,
  textarea {
    color: #000;
  }

  That will give you a black font color in any contact form you use. :)

• 

  howardpublicschool · Member · Sep 24, 2013 at 11:56 am

  • Copy link

  Thank you @jcasta, your solution has worked perfectly!

  Cheers!