No puedo creer que me encontré con este problema por primera vez. He buscado muchas otras preguntas similares sobre SO con respecto al mismo problema, pero ninguna de ellas funcionó para mí.

Tengo una etiqueta img con un atributo de clase debajo de la etiqueta de anclaje.

Entonces mi HTML se ve así:

<ul id="racing-menu" class="accordion-menu list-unstyled">
  <li>
    <a id"something" name class"something">
      <img class="icon_71">
    </a>
  </li>
</ul>

CSS

.icon_71 {
  background: url(../../cms/images/sports/something.png) no-repeat;
  width: 36px;
  height: 22px;
  margin: 0 10px 0 0;
  float: left;
}

Probé las siguientes soluciones para evitar el borde predeterminado en el navegador Chrome

1) borde: 0 2) esquema: ninguno 3) cambiar la clase img a id img

4) Configuración

a img {
  border:none
} 

a img {
  border:0
}