Der Buchhalter: SVG-Datei als mask-image

Beitrag lesen

Moin,

ich habe gerade ein, für mich nicht nachvollziehbares, Phänomen erlebt und hoffe, ihr könnt den Hintergrund aufklären.

Ich möchte ein SVG als Maske in CSS nutzen und irgendwie wollte das nicht funktionieren. Ich habe dann ein funktionierendes Online-Beispiel Stück für Stück in meine lokale Umgebung übertragen und den Knackpunkt gefunden.

Sobald ich die SVG-Datei lokal abgelegt und verknüpft hatte, stellte die Maske ihren Dienst ein. Und seitdem ich den Apache gestartet habe und mir die Seite vom Server ausliefern lasse, funktioniert wieder alles wie erwartet.

Die Masken-Funktionalität der CSS-Eigenschaft mask-image mit externer SVG hängt also davon ab, ob die SVG-Datei vom Server ausgeliefert wird oder nicht‽ Ich kann mir nur vorstellen, dass es mit dem MIME-Type zu tun hat. Ich habe allerdings zu wenig (bis gar keine) Ahnung von Servern, so dass ich meine Vermutung nicht selbst überprüfen kann/möchte. Geht meine Annahme in die richtige Richtung?

Mögliche Folgefrage: warum benötigt dieselbe SVG-Datei als background-image: url(mask.svg); keinen Server, aber als mask-image: url(mask.svg); schon?

Grüße vom Buchhalter