Изменение размера изображения: перед элементом

Question

Я создаю мобильное меню и изображение кнопки меню гамбургера. Я хочу изменить размер изображения. Я попытался сделать это:

Can I change the height of an image in CSS :before/:after pseudo-elements?

Но это не работает для меня. Мой код был таким:

.nav-btn:before { 
     background-image: url('icons/mobile_menu_bttn.png'); 
     background-size: 16px 16px; 
     width: 16px; 
     height: 16px; 
     content:""; 
    } 

Это нарушает код.

Я первоначально имел такой код:

.nav-btn:before { 
     content: url('icons/mobile_menu_bttn.png'); 
} 

Я попытался добавить только ширину и высоту, и это не сработало.

Кто-нибудь знает, как я могу это сделать?

Answer 1

a) Добавить display: block; в :before.

b) Добавить http:// в начало изображения. URL.

Кнопка все еще существует и работает нормально. Но ресурс изображения не найден, поэтому нет изображения. То есть есть проблема с URL-адресом, по крайней мере, это то, что говорит Chrome на консоли.