Form Field Hint Font Face | Community
Skip to main content
J
Jim_DiModica
New Participant
July 19, 2016
Solved

Form Field Hint Font Face

  • July 19, 2016
  • 1 reply
  • 4309 views

Hi -

How can I control the "Hint" font face? The form has two fields (Email Address & Postal Code).

I've tried this custom CSS but it has no effect.

<style type="text/css">

.mktoForm input[type=text],

.mktoForm input[type=email],

.mktoForm select.mktoField,

.mktoForm textarea.mktoField

{

  color:#444444 !important;

  font-family: Arial, Helvetica, sans-serif;

  font-size: 11px;

}

</style>

Thanks for any info!

- Jim

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 Jenna_Molby10

Hint text is also called placeholder text in HTML it can be styled using this CSS:

::-webkit-input-placeholder { /* Chrome/Opera/Safari */

  font-family:'Roboto', Sans-serif;

}

::-moz-placeholder { /* Firefox 19+ */

  font-family:'Roboto', Sans-serif;

}

:-ms-input-placeholder { /* IE 10+ */

  font-family:'Roboto', Sans-serif;

}

:-moz-placeholder { /* Firefox 18- */

  font-family:'Roboto', Sans-serif;

}

1 reply

Jenna_Molby10
Jenna_Molby10Accepted solution
New Participant
July 19, 2016

Hint text is also called placeholder text in HTML it can be styled using this CSS:

::-webkit-input-placeholder { /* Chrome/Opera/Safari */

  font-family:'Roboto', Sans-serif;

}

::-moz-placeholder { /* Firefox 19+ */

  font-family:'Roboto', Sans-serif;

}

:-ms-input-placeholder { /* IE 10+ */

  font-family:'Roboto', Sans-serif;

}

:-moz-placeholder { /* Firefox 18- */

  font-family:'Roboto', Sans-serif;

}

    SanfordWhiteman
    SanfordWhiteman
    New Participant
    July 19, 2016

    Don't forget the polyfill in IE 8/9, which doesn't use native placeholders.

    J
    Jim_DiModicaAuthor
    New Participant
    July 19, 2016

    Thanks, Sanford, for adding to the thread. "polyfill" ? Have an example?

    And is there a different tact for Chrome?

    Terms & ConditionsAccessibility statement

    Loading footer...