Problem mit "clip-path: url(...)"

[Gunnar Bittersmann]

@@x51398

Leider erstreckt sich die Maske nicht über die gesamte Bildhöhe, nur bis ca. 50%. Hat jemand einen Tipp für mich?

In die Beschreibung von clipPathUnits="objectBoundingBox" [MDN] geschaut:

“…and the width and height of the object bounding box are considered to have a length of 1 unit value.”

Die viewBox ist damit hinfällig, kannste weglassen.

Der Pfad der Maske hat ein Seitenverhältnis von 1:1 und wird auf das Seitenverhältnis des Bildes skaliert – mit verschiedenen Faktoren in x- und y-Richtung (wenn das Bild nicht gerade quadratisch ist).

Und wenn du da mit M1,0.469l-1,-0 anfängst, schneidest du den unteren Teil des Bildes ab. Wenn du das nicht willst, musst du schon bei M1,1 anfangen.

Das letzte l-Kommando ist unsinnig, Z/z schließt ja den Pfad.

M1,1l-1,-0l0,-0.422c0.335,-0.063 0.668,-0.063 1,-0Z sollte tun, was du willst.

🖖 Живіть довго і процвітайте

PS: Mir ist der SVGPathEditor ein unverzichtbares Tool geworden – in der CSSBattle. 😊