Почему Mozilla Firefox некорректно отображает SVG иконку?

Question

[Расул Гитинов]

Во всех браузерах отображается нормально и именно в Firefox неправильно. Вот скрин:

Вот код иконки на всякий:

<svg width="12" height="16" viewBox="0 0 12 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
	<g id="canvas" transform="translate(443 345)">
		<g id="search-icon">
			<g id="line">
				<use xlink:href="#path0_stroke" transform="matrix(0.496024 0.868309 -0.863711 0.503987 -435.439 -336.055)"/>
			</g>
			<g id="ellipse">
				<mask id="mask0_outline_ins">
					<use xlink:href="#path1_fill" fill="white" transform="translate(-443 -345)"/>
				</mask>
				<g mask="url(#mask0_outline_ins)">
					<use xlink:href="#path2_stroke_2x" transform="translate(-443 -345)"/>
				</g>
			</g>
		 </g>
	</g>
	<defs>
		<path id="path0_stroke" d="M 0.00980265 1.06793L 6.94346 0.99996L 6.92386 -0.999944L -0.00980265 -0.931972L 0.00980265 1.06793Z"/>
		<path id="path1_fill" d="M 11 5.55871C 11 8.62869 8.53756 11.1174 5.5 11.1174C 2.46243 11.1174 0 8.62869 0 5.55871C 0 2.48872 2.46243 0 5.5 0C 8.53756 0 11 2.48872 11 5.55871Z"/>
		<path id="path2_stroke_2x" d="M 8.99999 5.55871C 8.99999 7.5442 7.41302 9.11741 5.5 9.11741L 5.5 13.1174C 9.6621 13.1174 13 9.71319 13 5.55871L 8.99999 5.55871ZM 5.5 9.11741C 3.58697 9.11741 2 7.5442 2 5.55871L -2 5.55871C -2 9.71319 1.3379 13.1174 5.5 13.1174L 5.5 9.11741ZM 2 5.55871C 2 3.57321 3.58697 2 5.5 2L 5.5 -2C 1.3379 -2 -2 1.40422 -2 5.55871L 2 5.55871ZM 5.5 2C 7.41302 2 8.99999 3.57321 8.99999 5.55871L 13 5.55871C 13 1.40422 9.6621 -2 5.5 -2L 5.5 2Z"/>
	</defs>
</svg>

Comments

[arsenty]

С самим кодом вроде всё Ок. У меня на MacOS во всех браузерах выглядит норм.

[Сергей Горячев]

Смотрю в FF на Linux Mint, все нормально вроде.

[Расул Гитинов]

Сергей Горячев, arsenty, Странно, у меня вот так. А в чем может быть загвоздка?

[arsenty]

Расул Гитинов, иконка выглядит так, будто проблемы в рендеринге, а это часто локальные проблемы, например, из-за браузерных расширений.

[Расул Гитинов]

arsenty, Понятно. Спасибо за помощь)

Answer 1

[Moskus]

Вообще, у вас SVG-файл чудовищно усложнен.
Зачем в нем используется маска, какие-то сложные stroke, viewport меньше размеров объектов и так далее? Каждое подобное излишество, потенциально, может влиять на рендеринг (хотя, в идеале, не должно, но если есть шанс, что что-то пойдет не так, они его заметно повышают).