Chris Rathjen
Chris Rathjen

Reputation: 21

Style span element on focus

The problem I am having is hard coding the style element focus in a HTML tag. On the css page it looks something like this:

span.select.focus {
    background:rgba(189, 189, 189);
    border-right:solid 8px rgba(170, 194, 31, 0) !important;
}

Where is I can hard style the element without the focus

<span data-prefix="Shopping cart: " class="select profile" id="wordsPerQuiz" style="background-color: rgb (189,189,189)"> </span>

Here is my attempt.

  <span data-prefix="Shopping cart: " class="select profile" id="wordsPerQuiz" style="background-color: rgb (189,189,189)" focus="background-color: rgb (189,189,189)"> </span>

Upvotes: 1

Views: 15949

Answers (1)

pavel
pavel

Reputation: 27072

Pseudoclass focus needs to : before, not .:

span.select:focus {
    background:rgb(189, 189, 189);
    border-right:solid 8px rgba(170, 194, 31, 0) !important;
}

Element with span.select.focus selector is <span class="select focus"> in HTML.

Upvotes: 2

Related Questions