How do I remove the square when I click on the icon?

0

I am testing the navbar bootstrap and, as I do not know much about styles, I do not know how to solve. When I click on the icon a dotted frame appears outside the outline of the image as below:

Iknowthisisrelatedtothestyleofthepage,butIdonotknowhowtosolveit.HereisthecodeforthepageI'musing:

<!DOCTYPEhtml><html><head><linkhref="css/bootstrap.css" rel="stylesheet">
  <link href="font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css">
 </head>
 <nav class="navbar navbar-default navbar-fixed-top" role="navigation">
 <div class="container">
  <div class="navbar-header">
   <a class="navbar-brand" href="#">
    <img alt="Brand" src="lib/img/mig.png">
   </a>
   <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-navbar-collapse-1">
    <span class="sr-only">Toggle navigation</span>
   </button>
   <h1 class="navbar-header" href="#">Home</h1>
  </div>
  <!-- Collect the nav links, forms, and other content for toggling -->
  <div class="collapse navbar-collapse" id="bs-navbar-collapse-1">
   <br>
    <ul class="nav nav-pills navbar-right">
     <li class="active"> 
       <a href="#">Home</a>
     </li>
     <li class=""> 
       <a href="#">About</a>
     </li>
     <li class=""> 
       <a href="#">Contact</a>
     </li>
     <li class=""> 
       <a href="#">Maps</a>
     </li>       
    </ul>
   </br>
  </div>
   <!-- /.navbar-collapse -->
  </div>
  <!-- /.container -->
 </nav>
 <body> 
 </body>
</html>
    
asked by anonymous 20.02.2016 / 15:46

1 answer

1

This property is called outline, you can remove it like this: outline: none :

a:active, a:focus { 
    outline: none; 
    ie-dummy: expression(this.hideFocus=true);
}

This form is the most compatible one I found, it works from IE9 Up.

    
22.02.2016 / 19:16