score:2

Accepted answer

this is indeed a chrome bug. if you reverse the order of <defs> and the <path> element, then it works. this is basically the same issue as with the <use> element.

score:5

a workaround which i've made work adds an extra moveto command to the beginning of the d attribute:

<path clip-path="url(#clip)" d="m -10,-10 m 0,100 h 1000 v 100" style="stroke: #000; stroke-width: 2px"></path>

view in browser

the extra moveto has no visible effect but means that the path is not technically straight. it is visible and clipped correctly in chrome.


Related Query

More Query from same tag