When a hyperlink becomes active or gets focus, a dotted line appears around the link to differentiate it from other links, this is the default behavior of a hyperlinks. It is basically the dotted outline that does not affect the surrounding element as border does.
If you want to remove this outline you can apply these styles to your links:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Removing Dotted Outlines Using CSS</title>
<style>
a, a:active, a:focus{
outline: none; /* Works in Firefox, Chrome, IE8 and above */
}
</style>
</head>
<body>
<div class="menu">
<a href="#">Home</a> | <a href="#">About Us</a> | <a href="#">Contact</a>
</div>
</body>
</html>
Use the CSS
outline
propertyWhen a hyperlink becomes active or gets focus, a dotted line appears around the link to differentiate it from other links, this is the default behavior of a hyperlinks. It is basically the dotted outline that does not affect the surrounding element as border does.
If you want to remove this outline you can apply these styles to your links:
need an explanation for this answer? contact us directly to get an explanation for this answer