Нестандартный размер .ico с CSS

Question

Я хочу определить размер загруженного файла .ico с помощью CSS, потому что по умолчанию в FireFox и Chrome.

HTML код моей ссылки:

<a href="https://www.google.com/maps/place/##keyword##" target="_blank" title="show on map" class="showonmap">##keyword##</a> 

и код CSS для этого:

.showonmap { 
    background: url("images/gmaps3.ico") no-repeat scroll right center rgba(0, 0, 0, 0); 
    padding-right: 20px; 
} 

http://jsfiddle.net/eapo/yy8gqt3f/1/ (проверьте с другим браузером, чтобы увидеть проблему)

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

Answer 1

Использование background-size:

.showonmap { 
    background: url("https://maps.gstatic.com/favicon3.ico") no-repeat scroll right center rgba(0, 0, 0, 0); 
    padding-right: 20px; 
    background-size: 15px 15px; 
} 

Демо: http://jsfiddle.net/yy8gqt3f/2/

---

Вы также можете сделать изображение 100% высоту, сохраняя исходное соотношение сторон:

background-size: auto 100%; 

Демо: http://jsfiddle.net/yy8gqt3f/4/