CODEWITHSUNDEEP
htmlcss
user1464139
user1464139

Reputation:

How can I specify a CSS tag for not disabled and hover on a button?

I am trying the following:

button:disabled {
    border-color: #50a3c8 #297cb4 #083f6f;
    background: #0c5fa5 url(/Content/images/old-browsers-bg/button-element-bg.png) repeat-x left top;
    .top-gradient( #FFF, #72c6e4, 4%, #0c5fa5);
    color: white;
}

button:not(disabled):hover {
    border-color: #1eafdc #1193d5 #035592;
    background: #057fdb url(/Content/images/old-browsers-bg/button-element-hover-bg.png) repeat-x left top;
    .top-gradient(#FFF, #2bcef3, 4%, #057fdb);
}

But my IDE is saying that "disabled" is not a valid HTML tag however just for the second CSS definition where disabled is enclosed in parenthesis.

Upvotes: 0

Views: 96

Answers (2)

Tamil Selvan C
Tamil Selvan C

Reputation: 20199

Try this, use :not(:disabled)

button:not(:disabled):hover {
    border-color: #1eafdc #1193d5 #035592;
    background: #057fdb url(/Content/images/old-browsers-bg/button-element-hover-bg.png) repeat-x left top;
    .top-gradient(#FFF, #2bcef3, 4%, #057fdb);
}

Upvotes: 1

Explosion Pills
Explosion Pills

Reputation: 191749

That would be :not(:disabled)

http://jsfiddle.net/yVanF/

Just for a bit more clarity: http://jsfiddle.net/yVanF/1/

Upvotes: 1

Related Questions