Skip to main content
S
sxs726
Known Participant
April 10, 2019
Answered

Website: contact form, how to change the colour of the input field and scrolling?

  • April 10, 2019
  • 2 replies
  • 1114 views

Hello everyone!

This is my website: www.sheilaschaefer.com, I have two problems that I am not able to see where I can put it right, well I did try, but with no avail.

1. contact in the navbar will not scroll down to the contact form page in the page (the other three navbar items scroll nicely though);

2. The input fields for the contact form is white text with a white background.  I went into custom.css to change the text dark blue for the input text, but it is still white.  I had followed a step by step tutorial on youtube for  this really nice contact form.

Please can anyone help me in putting this right by letting me know what I cannot for the life of me see?

Thank you

Sheila

This topic has been closed for replies.
Correct answer Jon Fritz

Right now, you have <div id="contact form" as your form's id, but <a href="#Contact"> for the link.

ID's can't have spaces.


Change it to <div id="Contact" and it should work (unless you have other errors).

You can validate your page at http://validator.w3.org/nu to get a listing of any other errors.

2 replies

Jon Fritz
Community Expert
Jon FritzCommunity Expert
Community Expert
April 10, 2019

As for your second question, I don't see any background-color setting for your form fields in your css.

Something like...


textarea, input[type=text] {
     background-color:#ffd17b;
}

...with your own color in place of #ffd17b should do it.

EDIT:

...and I read too fast, looks like you want to change the placeholder text color inside the fields?

If so, this will work, though it's non-standard and probably isn't fully supported in all browsers...

::placeholder | CSS-Tricks

S
sxs726Author
Known Participant
April 10, 2019

I had followed a youtube tutorial and I am going through the video for the fifth time, as his contact sheets works perfectly, e.g. when he uploads it to the server and writes in the text fields it is black whereas mine is white/clear.  The code is in custom.css, which I am not sure if you can see it when viewing my website.

Thank you though for your advice. 

Sheila

Jon Fritz
Community Expert
Jon FritzCommunity Expert
Community Expert
April 10, 2019

Ah, OK, so you are talking about the color of the text after the viewer starts typing.

Looks like your custom.css file hasn't been uploaded, or was uploaded to the wrong location. When I try to view it, I get a 404 File No Found Error.

Jon Fritz
Community Expert
Jon FritzCommunity ExpertCorrect answer
Community Expert
April 10, 2019

Right now, you have <div id="contact form" as your form's id, but <a href="#Contact"> for the link.

ID's can't have spaces.


Change it to <div id="Contact" and it should work (unless you have other errors).

You can validate your page at http://validator.w3.org/nu to get a listing of any other errors.

S
sxs726Author
Known Participant
April 10, 2019

Thank you very very much.  I did the change and it is now scrolling nicely to Contact.

I appreciate you advice.

Terms & ConditionsAccessibility statement
Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices