Мои SVG постоянно отображают "меньше", чем они должны быть
Я не совсем уверен, что здесь происходит. Я экспортирую SVG из иллюстраций артбордов. На досках они точно одинакового размера (это набор иконок).
Однако, когда я устанавливаю их в качестве фонового изображения, есть такие, которые не будут постоянно "заполнять" пространство, которое они должны занимать в параметрах высоты / ширины.
Вот jsFiddle, чтобы показать, что я имею в виду. Оба они были точно так же экспортированы из Illustrator... и если вы посмотрите меньший, он физически займет столько же места, как если бы был внутренний отступ. Так что, даже если в CSS он будет вдвое больше, width/height: 110px;, его становится трудно позиционировать, поскольку он отталкивает другие элементы.
У меня в общей сложности 6 иконок, используемых в этом наборе, и 4 из них абсолютно одинаковы. Есть 4, которые меньше, как это, хотя я не уверен, почему это так.
1 ответ
Прежде всего, выкрикивайте ccprog за то, что я заметил, что в моем SVG-файле есть встроенный PNG-массажер простаты. Определенно побеждает мою цель использования SVG. Вытащил его, и хотя размер файла уменьшился на 2 МБ, я все еще сталкивался с моей первоначальной проблемой.
Если у кого-то есть понимание того, что здесь происходит, это было бы удивительно, но, надеюсь, это поможет кому-то еще столкнуться с этим.
Я использовал Shopify, когда заметил это, но, похоже, это также влияет на мой jsFiddle, поэтому я не думаю, что он специфичен для определенных сервисов (хотя я знаю, что Shopify делает много вещей в bg в отношении сжатия и т. Д.) пробовал все варианты экспорта, которые я мог в Illustrator. Кто-то в этом ответе предложил что-то вроде обычного сохранения, а не экспорта, и автоматически добавляется суффикс -01 Illustrator.
Я сделал это, и это сработало внезапно. Я поиграл и снял -01 с имени файла, и у меня ОДИНАКОВАЯ проблема, как и раньше. Итак, в следующий раз я сохранил прямо из Illustrator и убедился, что не было "-01". Опять же, проблема сохраняется. Я просто переименовал файл, поставив там -01. Без вопросов.
Я понятия не имею, почему это так, но использование '-01' в конце имени файла исправило мою проблему. Я больше ничего не менял.