Как удалить синюю границу между я тегами

Question

У меня есть этот HTML

<div class="text-center" style="position: absolute;z-index: 9;bottom: 1%; width:100%; color:rgba(0, 0, 0, 0.51);font-size:50px;"> 
<i class="fa fa-plus-circle pointer" title="Zoom In" onclick="foyrPlayer.OnPanoramaButtonPressed('zoomin');"></i> 
<i class="fa fa-minus-circle pointer" title="Zoom Out" onclick="foyrPlayer.OnPanoramaButtonPressed('zoomout');"></i> 
<i class="fa fa-arrow-circle-left pointer" title="Back" onclick="prevLevelSection()"></i> 
<i class="fa fa-adjust pointer " title="Change Color" onclick="toggleVariant();"></i> 
</div> 

, когда я нажимаю на любом элементе больше, чем когда-то, есть синий цвет появляется между теми, проверьте изображение

это не контур. Как избежать/удалить эту голубую линию

Answer 1

С нажав несколько раз за короткий промежуток времени, вы активизируете выделение текста. Итак, что вы на самом деле делаете, это выбрать пространство между белыми элементами.

Если вы хотите, чтобы предотвратить выделение, вы можете добавить дополнительный класс, как предложено в this post:

*.unselectable { 
    -moz-user-select: -moz-none; 
    -khtml-user-select: none; 
    -webkit-user-select: none; 

    /* 
    Introduced in IE 10. 
    See http://ie.microsoft.com/testdrive/HTML5/msUserSelect/ 
    */ 
    -ms-user-select: none; 
    user-select: none; 
} 

Answer 2

Это происходит из-за знака выбора мыши. user-select Свойство CSS может помочь вам избежать этого внешнего вида.