I have replicated my problem in the following simple example
I have a simple webpage like the following:
<?xml version="1.0" encoding="utf-8"?>
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<svg viewBox="0 0 12 12" enable-background="new 0 0 12 12" id="close">
<path d="M7.2 6l4.5-4.4c.4-.4.4-.9 0-1.3s-.9-.4-1.3 0L6 4.7 1.6.3C1.2-.1.7-.1.3.3s-.4.9 0 1.3L4.7 6 .3 10.4c-.4.4-.4.9 0 18.104.22.168.22.214.171.124s.5-.1.7-.3L6 7.3l4.4 4.4c.126.96.36.199.7.3.2 0 .5-.1.7-.3.4-.4.4-.9 0-1.3L7.2 6z" opacity=".3" enable-background="new"/>
<svg viewBox="0 0 58 46" enable-background="new 0 0 58 46" id="error">
<path class="st0" d="M30.6 1c-.9-1.4-2.3-1.4-3.2 0L.4 43.5C-.5 44.9.2 46 1.8 46h54.4c1.7 0 2.3-1.1 1.4-2.5L30.6 1z"/>
<path class="st1" d="M26.3 15.2h5.5V30h-5.5zM26.3 33.5h5.5v5.3h-5.5z"/>
This is due to incomplete/buggy SVG fragment CSS support in Safari. Browser support for this technique is still relatively patchy - see https://css-tricks.com/svg-fragment-identifiers-work/
Current versions of Chrome/Safari/Opera (38/8/25) handle all the HTML techniques well, but none of the CSS techniques, including the background-position one.
Some experiments with your content follow:
If I repeat the pair of images a second time, the fourth image is somehow a composite of the two (below left). No interpretation of your svg should ever be able to produce an image like this. Interestingly, I get exactly the same split if you use different styling properties, e.g. opacity (below right):
If I zoom in and out with cmd++ and cmd+-, the overlaps and partial images change.
Resizing the page also has an effect.
Speculating that the styling of the images might somehow be interacting with one another, I tried having four different copies of the image (
icons2.svg#error etc.) and referring to them separately. This mostly fixed the problem, but the fourth image was missing the bottom three quarters. However, as soon as I resized the window, the missing part of the image appeared.
Bottom line: incomplete/buggy svg fragment identifier/CSS handling.