Почему вдруг векторное изображение сжалось?

Question

[ligisayan]

Всем привет! Есть сайт в котором лого есть векторная картинка svg. Во всех сервисах и в том числе панели инструментов все выглядит замечательно

но, на мобилках с диагональю 5 дюймов (android) наблюдаю такую картину, где буквы налазят друг на друга

Это ведь вектор - почему изображение сжато? Это глюк? В части дизайна или структуры?

Answer 1

[xmoonlight]

<text xmlns="http://www.w3.org/2000/svg" x="2407" y="1692" class="fil3 str1 fnt0">Stringers</text>
<text xmlns="http://www.w3.org/2000/svg" x="6850" y="1692" class="fil4 str2 fnt0">Hub</text>

https://www.w3.org/TR/SVG2/text.html

Comments

[ligisayan]

xmoonlight вы имеете ввиду в таком примерно виде?

<svg width="175" height="45">
    <image width="175" height="45" src="/wp-content/themes/onepress/assets/images/logo.svg" onerror="this.onerror=null; this.src=\'/wp-content/themes/onepress/assets/images/logo.jpg\'" class="custom-logo" alt="" itemprop="logo">
	<text xmlns="http://www.w3.org/2000/svg" x="2407" y="1692" class="fil3 str1 fnt0">Stringers</text>
	<text xmlns="http://www.w3.org/2000/svg" x="6850" y="1692" class="fil4 str2 fnt0">Hub</text>
	</svg>

[ligisayan]

xmoonlight так тоже не катит

<object type="image/svg+xml" width="175" height="45"  data="/wp-content/themes/onepress/assets/images/logo.svg">
  <text xmlns="http://www.w3.org/2000/svg" x="2407" y="1692" class="fil3 str1 fnt0">Stringers</text>
<text xmlns="http://www.w3.org/2000/svg" x="6850" y="1692" class="fil4 str2 fnt0">Hub</text>
</object>

[xmoonlight]

ligisayan: переведите буквы в кривые Бизье

[ligisayan]

xmoonlight: в самом svg -верно? т.е. заменяю эти строки

<text x="2407" y="1692"  class="fil3 str1 fnt0">Stringers</text>
   <text x="6850" y="1692"  class="fil4 str2 fnt0">Hub</text>

на эти

<text xmlns="http://www.w3.org/2000/svg" x="2407" y="1692" class="fil3 str1 fnt0">Stringers</text>
   <text xmlns="http://www.w3.org/2000/svg" x="6850" y="1692" class="fil4 str2 fnt0">Hub</text>

но, ничего существенного не изменилось - выводится все точно также, с накладкой

[xmoonlight]

ligisayan: посмотрите как сделано здесь с текстом: jsfiddle.net/helderdarocha/e4bAh

[ligisayan]

xmoonlight: С дизайнером решили вопрос - спасибо за помощь!

[xmoonlight]

ligisayan: Отлично. Welcome!