How to remove the dotted selection border on links?

I'm talking about the dots that mark your clicked selection, the border around selected links and other elements having focus.

Ofcourse a default styling is responsable for this behaviour:

li:focus{outline: 1px dotted invert;} a:focus{outline: 1px dotted invert;}

So annoying, as it can create scrollbars if your (block styled) elements are of width 100%, as it then will be of width 100% + 2px (in some browsers) when clicked upon (with the "outline" border).

Therefore:

*:focus{outline:none;}

That's it...!

< tricks index