[as.kharlov]

Есть 2 иконки в формате svg (googleplus и ВКонтакте).
Вставляются в html-код идентично:

<p>Войти через: <span class="social fb">Facebook</span> <span class="social gp">Google +</span><span class="social vk">ВКонтакте</span><span class="social tw">Twitter</span></p>

Точнее иконки 4, все, кроме иконки ВКонтакте отображаются корректно, а ВКонтакте сильно обрезается.
С svg работаю впервые, 3 часа Гуглил, ставил ПО и т.д., проблемы так и не понял. Файлы скриншотов приложены к теме (проблемная иконка 3-я слева)
Когда открываю иконки в Adobe Illustrator, то те иконки, которые нормально отображаются (не обрезаются) в Иллюстраторе в 4 раза больше по размеру, а ВК (проблемная) в 4 раза меньше остальных.
Сохранил иконки в jpeg и открыл в Фотошопе - та же ситуация: размер всех иконок, которые отображаются корректно в 4 раза больше, чем у проблемной ВК, которая обрезается.
Я в ступоре! Подскажите в каком направлении копать?

Вот фрагмент css:
#login .social { display: inline-block; height: 20px; margin-left: 7px; padding: 0 2px; cursor: pointer; border-radius: 3px; }
#login .social:before { content: ""; display: inline-block; width: 15px; height: 15px; vertical-align: top; margin: 3px 5px 0 0; }
#login .social.fb:before { background: url('../img/fc-webicon-facebook.svg') no-repeat; }
#login .social.gp:before { background: url('../img/fc-webicon-googleplus.svg') no-repeat; }
#login .social.tw:before { background: url('../img/fc-webicon-twitter.svg') no-repeat; }
#login .social.vk:before { background: url('../img/fc-webicon-vkontakte.svg') no-repeat; }
#login .social:hover { color: #333; background: #eee; box-shadow: 1px 1px 1px #bbb; }

[as.kharlov]

Вопрос решен.
В теге <svg> svg-файла поудалял атрибуты height и width и все стало гуд.

[Hispanic]

нужно просто нормально сохранять, через люстру, там есть настройки определенные