CODEWITHSUNDEEP
htmlcss
Ogen
Ogen

Reputation: 6709

Changing the appearance of a button when you tab to it

I have this code: http://liveweave.com/Lpdsjv

I made it so as the username is tabbed to first, then the password, then the log in button and then the tabs that say getting started etc.

However, there is no indication to the user that he/she has reached the getting started/vegetables tabs. For example when you tab to username it gets highlighted blue, but after you tab from the log on button. There is no indication that the user is at the tabs, how can I implement this?

Upvotes: 0

Views: 360

Answers (1)

Ankur Aggarwal
Ankur Aggarwal

Reputation: 3101

Use :focus pseudo class http://css-tricks.com/almanac/selectors/f/focus/

elementSelector:focus
{
     //your css
}

In your case you are giving the tabIndex to radio button but providing the background-color to label. So first change it to label tag

<label for="tab1" tabindex="4">Getting Started</label>

CSS:

.tabs label li:fous
{
   background-color:#000000;
}

Liveweave: http://liveweave.com/HfDY6M

Upvotes: 3

Related Questions