Since 20 June 2024, our both websites have stopped displaying svg sprite images in Chrome browser. The pictures have been displayed like this on the site for 4 years, we haven’t had any updates to the site recently. However, everything still works in Firefox, Opera, and mobile Chrome.
Example of code on website bigtrip.by:
<svg><use xlink:href="/img/public/icons.svg#fb"></use></svg>
Example of svg file “icons.svg”:
<svg viewBox="0 0 25 25" xmlns="http://www.w3.org/2000/svg">
<style>
symbol { display: none }
symbol :target { display: inline }
</style>
<symbol id="lock" viewBox="0 0 448 512">
<path d="M400 224h-24v-72C376 68.2 307.8 0 224 0S72 68.2 72 152v72H48c-26.5 0-48 21.5-48 48v192c0 26.5 21.5 48 48 48h352c26.5 0 48-21.5 48-48V272c0-26.5-21.5-48-48-48zm-104 0H152v-72c0-39.7 32.3-72 72-72s72 32.3 72 72v72z"/>
</symbol>
<symbol id="fb" viewBox="0 0 25 25">
<path d="M13.625 9.84375V7.71875C13.625 7.13225 14.129 6.65625 14.75 6.65625H15.875V4H13.625C11.7609 4 10.25 5.42694 10.25 7.1875V9.84375H8V12.5H10.25V21H13.625V12.5H15.875L17 9.84375H13.625Z"/>
</symbol>
</svg>
Example on website
The “xlink:href” attribute is already deprecated, we tried replacing it with “href” – didn’t help.
In the Chrome console, there is an error “Attestation check for Topics on https://mc.yandex.com/ failed.”. We fixed it, but it didn’t help.
Andrei is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.