User Agent: Mozilla/5.0 (X11; Linux x86_64; rv:22.0) Gecko/20100101 Firefox/22.0 (Beta/Release) Build ID: 20130618035212 Steps to reproduce: I have written a simple SVG file to display a cirle: *********************************************************************** <?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"> <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" x="0" y="0" width="200" height="200"> <circle cx="100" cy="100" r="20" stroke="black" stroke-width="120" fill="red"/> </svg> *********************************************************************** Actual results: However, Firefox 22 displays the SVG circle very differently with Chrome 19 and Opera 11 on Ubuntu 12.04 (see the attachment). IE has not been tested. Expected results: The stroke shouldn't override the filled zones. I'm not sure which one should be the expected result. Perhaps it is a bug of Chrome and Opera.

Firefox Nightly (25) on Mac renders the same as your Chrome and Opera screen shots, i.e. showing the red circle in the middle. Isn't the correct rendering what you are seeing, though? The very wide stroke shape should look like a solid black circle of radius 80.

I see the full black circle with FF22/25 on Win 7: http://i.imgur.com/DtDdwmc.jpg

IE9 displays the same rendering too.

I also tested the following code: ********************************************************************************************* <?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"> <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" x="0" y="0" width="200" height="200"> <rect x="100" y="100" width="20" height="20" stroke="black" stroke-width="120" fill="red"/> </svg> ********************************************************************************************* It is strange that Firefox displays a red rect in the center surrounded by a white rect, while Chrome displays a full black rect, and Opera displays a red rect in the center surrounded by a white diamond.

I see a full black rectangle.

Maybe some Linux only rendering bug? Is there OS-specific rendering code for SVG images, not sure about that..

It'll be Cairo's use of different platform backends that causes this different behaviour with very large stroke-width values.

For me, disabling HWA doesn't fix anything, still a black rect or circle.

This is still an issue today, at least on Windows and it causes trouble when trying to create things like pie charts or rays using strokes. Live test https://codepen.io/thebabydino/pen/LrvaRZ?editors=1000 Screenshot of result in Chrome (expected) https://pbs.twimg.com/media/DhQdugpWAAARkb7.jpg Screenshot of result in Firefox/ Edge https://pbs.twimg.com/media/DhQdugrXcAA99VK.jpg Seems to become more obvious the more slices the pie we create this way has. Live test #2 https://codepen.io/thebabydino/pen/QBXxmV?editors=1100 Screenshot of result in Chrome (expected) https://pbs.twimg.com/media/DkvPnt1W4AAtOqq.jpg Screenshot of result in Firefox/ Edge https://pbs.twimg.com/media/DkvPntxXsAEI2KU.jpg

I don't have this issue with Firefox 61.0.2 (64-bit) for Mac OS (In reply to Ana Tudor from comment #11) > This is still an issue today, at least on Windows and it causes trouble when > trying to create things like pie charts or rays using strokes. > > Live test https://codepen.io/thebabydino/pen/LrvaRZ?editors=1000 > > Screenshot of result in Chrome (expected) > https://pbs.twimg.com/media/DhQdugpWAAARkb7.jpg > > Screenshot of result in Firefox/ Edge > https://pbs.twimg.com/media/DhQdugrXcAA99VK.jpg > > Seems to become more obvious the more slices the pie we create this way has. > > Live test #2 https://codepen.io/thebabydino/pen/QBXxmV?editors=1100 > > Screenshot of result in Chrome (expected) > https://pbs.twimg.com/media/DkvPnt1W4AAtOqq.jpg > > Screenshot of result in Firefox/ Edge > https://pbs.twimg.com/media/DkvPntxXsAEI2KU.jpg