Удалить "загадочную" горизонтальную линию из элемента <svg>? - PullRequest
Новая
       8

Удалить "загадочную" горизонтальную линию из элемента <svg>?

0 голосов
/ 13 июня 2018

Я добавил стилизованную границу SVG в.Он отображает как задумано, за исключением контрольной горизонтальной линии у нижнего края элемента svg.

Источник svg * 

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 2600 131.1" preserveAspectRatio="none">
    <path class="edge" style="opacity:1.00" d="M 2600,130.1 H 0 V 61 Z" />
    <path class="edge" style="opacity:0.50" d="M 2600,130.1 H 0 V 61 h 2600 z" />
    <path class="edge" style="opacity:0.25" d="M 0,130.1 H 2600 V 0 L 0,61 Z" />
</svg>

Здесь вы можете увидеть ошибочную горизонтальную линию

Codepen

(это снизу, синим цветом ...).

Я хочу, чтобы линия прошла.

У меня естьдо сих пор не удалось стилизовать его с помощью (S) CSS.

Я открыл svg в Inkscape, чтобы посмотреть, есть ли строка в источнике;по крайней мере, в Inkscape там ничего нет.

Как мне удалить эту строку?CSS?SVG?другой

1 Ответ

0 голосов
/ 13 июня 2018

Я думаю, я сделаю это ответом вместо комментария:

У вас есть viewBox="0 0 2600 131.1", но все ваши пути начинаются с 130.1.Итак, ваш добавленный пиксель.Измените его на viewBox="0 0 2600 130.1" (или измените пути на 131.1)

И чтобы быть более ясным, просачивается фон из вашего элемента .wrapper (попробуйте изменить цвет фона для доказательства),потому что ваше окно просмотра немного больше, чем ваш svg-контент, и потому что svg прозрачен там, где нет контента.

...