Get Even More Visitors To Your Blog, Upgrade To A Business Listing >>

CSS :not selector to target specific types of input

CSS :not selector to target specific types of input

Problem

I want to style ALL inputs except for Specific Types.

For example:

input,
input:not(type='email') {
    background: red;
}

The above doesn't work

So I want all inputs to have a background of red (obviously I don't this is just an example), except for input elements of type email. The type I am trying to target with the :not selector could be different.

Can this be acheived? If not, what is the best solution?

If you're curious I am trying to avoid specifying all types of input that I want to target just so the types I don't want targeting don't get that style.

Problem courtesy of: Dave Haigh

Solution

Try:

input:not([type='email'])

Keep in mind though, that by using input, input:not([type='email']) you're actually rendering the condition useless since you're specifying a bare input as well.

Solution courtesy of: haim770

Discussion

View additional discussion.



This post first appeared on CSS3 Recipes - The Solution To All Your Style Problems, please read the originial post: here

Share the post

CSS :not selector to target specific types of input

×

Subscribe to Css3 Recipes - The Solution To All Your Style Problems

Get updates delivered right to your inbox!

Thank you for your subscription

×