Solution 1 :

 a{
   outline:none
 }

add this style

Problem :

Considering the following:

<a tabindex="0" href="">With TabIndex</a>
<a href="">Without TabIndex</a>

https://jsfiddle.net/uLg7jyo9/1/

Mouse down on first link move away and mouse up, you will notice the blue border is still there.

do the same on the second link and you will notice it is not.

I want tab index to affect tab events not click events. How can I fix this?

Note: Firefox seems to treat them both the same.

Comments

Comment posted by Akhil Aravind

Can you give some more details, it seems confusing

Comment posted by support.google.com/chrome/answer/…

If you can supply with screen shots combined with steps as you described above would be good. Also I would recommend to report this issue to Google Chrome here

Comment posted by Gosi

I’m not sure why that happens, but adding

Comment posted by outlinenone.com

Can I ask why you’re adding a

Comment posted by outlinenone.com

Don’t do this without serious thought, it has huge impacts on accessibility for users:

Comment posted by DarrenCibis

This is not an option for us. We are required to support tabbing.

By