Changing the Form fields a different color | Community
Skip to main content
Callum_Pirie
Callum_Pirie
New Participant
March 20, 2019
Solved

Changing the Form fields a different color

  • March 20, 2019
  • 1 reply
  • 3987 views

Hi there,

I am trying to change the form fields to a darker grey and having issues in the CSS of Marketo

the page in question is Professional Diploma in Digital Marketing | Study Online | Enrolling Now

Here are some screenshots of how to get to the button

As you can see the grey is a bit 'washed out' so I want to change the color to a darker grey.

Thanks

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.
Best answer by Corey_Bethel

To change the placeholder text, which is the text you see before you type anything into a field, you'll need to add this to your custom CSS:

::placeholder {

color: #333 !important;

opacity: 1;

}

:-ms-input-placeholder {

color: #333 !important;

}

::-ms-input-placeholder {

color: #333 !important;

}

That will only work on the text field types. The font color on the select field types is specified inline on the select elements themselves, so it'll be hard to change that color with CSS. There may be a way to change it with JavaScript. May @Sanford Whiteman​ could help out with that?

1 reply

Corey_Bethel
Corey_Bethel
New Participant
March 20, 2019

Hi Callum,

Are you trying to make the border of the form fields darker? Currently, the color of the border is being set by "border-color: #ece6e6". You'll need to update the "border-color" to what ever color you want.

Corey BethelConsultant | Etumos
Callum_Pirie
Callum_PirieAuthor
New Participant
March 20, 2019

no its the actual text in the fields themselves not the border.

Corey_Bethel
Corey_BethelAccepted solution
New Participant
March 20, 2019

To change the placeholder text, which is the text you see before you type anything into a field, you'll need to add this to your custom CSS:

::placeholder {

color: #333 !important;

opacity: 1;

}

:-ms-input-placeholder {

color: #333 !important;

}

::-ms-input-placeholder {

color: #333 !important;

}

That will only work on the text field types. The font color on the select field types is specified inline on the select elements themselves, so it'll be hard to change that color with CSS. There may be a way to change it with JavaScript. May @Sanford Whiteman​ could help out with that?

Corey BethelConsultant | Etumos
Terms & ConditionsAccessibility statement

Loading footer...