CODEWITHSUNDEEP
csshoverfocuscss-selectors
Kishmyak
Kishmyak

Reputation: 7

CSS: no hovering if selected

For the most it sounds quite simple, but I'm new in this stuff.

input.input-text:hover {color:red}
input.input-text:focus {color:blue}

I want if input-text is focused it must not become red on hovering. Can we do that?

Upvotes: 0

Views: 1371

Answers (2)

antejan
antejan

Reputation: 2624

You can stack pseudos

input.input-text:focus:hover {
  color:green;
}

Upvotes: 5

Head
Head

Reputation: 568

I would use jquery to accomplish this because you are trying to conditionally set css. You can leave your css like it is, then add this on your html page

$("input.input-text:focus").hover().css('color', 'black');

If you haven't included the jquery script, add this to the head of the document:

 <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>

Upvotes: 1

Related Questions