Хотите удалить границу по умолчанию из моего фона img

Question

Как взять этот уродливый 1px black border вдали от этого фона?

Я сниму background: url(../images/thumbsDownSelected-Red.png); в инструментах разработчика веб-браузера Chrome, и все, что остается, это уродливая черная рамка 1px.

.thumbsUpSelected { 
    background: url(../images/thumbsUpSelected-Green.png); 
    background-size: 100% 100%; 
    background-repeat: no-repeat; 
    height: 65px; 
    width: 65px; 
    cursor: pointer; 
} 

<img src="" id="" class=" thumbsUpSelected thumbs-button "> 

Я попытался удалить src="", ничего не изменилось.

Даже сообщение img{border:0 !important} ничего не делает!

Я не ищу ссылку на img в src = так что избегайте публикации решений, которые делают это.

Что происходит? Почему существует мифическая граница, которая не отображается в dev-инструментах и ​​не может быть удалена?

Answer 1

Вы пробовали

border: none;

на DIV?

Это div, который имеет границу. Изображение - это только фон div, поэтому вы берете его, граница на div останется. Я предполагаю, что div имеет границу с некоторыми другими css (вероятно, с большими кнопками?). В этом случае вам нужно поставить важный или изменить другой класс.

Answer 2

Хорошо, я решил его

пустых тегов по умолчанию этой границы.

Простое изменение тега img на div устраняет проблему.

Answer 3

.thumbsUpSelected 
{ 
border: none; 
}