Tagged: , , , ,

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • April 22, 2014 at 11:09 pm #254672
    mikehirsch

    I want to make any form fields that are clicked in have a background/highlight color. I know I can use “:focus” but not sure where to put it. I’d like to cover ALL fields at one time if possible.

    For testing only text fields, I used:

    #top input[type=”text”]:focus {
    background-color: #51CBEE !important;
    }

    but, for example, not sure what the difference is in “#top .input-text” and “#top input[type=”text”]”

    April 22, 2014 at 11:20 pm #254676
    mikehirsch

    Hmmm, this seems to work but could I be missing anything?

    #top input[type=”text”]:focus,
    #top input[type=”email”]:focus,
    #top input[type=”tel”]:focus,
    #top input[type=”number”]:focus,
    #top textarea:focus,
    #top select:focus {
    background-color: #FFFA99 !important;
    }

    April 23, 2014 at 1:52 pm #254899
    Ismael

    Hi!

    Thank you for visiting the support forum.

    Did it work for you? You can use this if you want:

    #top input[type="text"]:focus, #top input[type="password"]:focus, #top input[type="email"]:focus, #top input[type="number"]:focus, #top input[type="url"]:focus, #top input[type="tel"]:focus, #top input[type="search"]:focus, #top textarea:focus {
box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.2);
color: #555;
background-color: #FFFA99 !important;
}

    Regards,
    Ismael

    April 23, 2014 at 8:55 pm #255202
    mikehirsch

    Yes it worked. Thanks!

  • Author
    Posts
Viewing 4 posts - 1 through 4 (of 4 total)
  • The topic ‘Form fields, change color on Focus’ is closed to new replies.