hampusborgos / country-flags

SVG and PNG renders of all countries' flags.

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Undesired hairline on some svgs

elrumordelaluz opened this issue · comments

Probably due to a subpixel rendering related stuff, some flags renders with a hairline of the path which is placed on the back.

flags_line.mp4

Here is the pen to play around.

As suggested by @aarongarciah a solution could be to use the shapes to fill only the space needed instead of fill the whole background of the svg.

I found a file with something like a list of sources for the flags, but seems that the base to create pngs is the /svgs folder, could help to make PRs to those flags that have the problem described above?

That's a interesting solution, and we'll happily accept pull requests for flags that "fix" this issue.

The real issue, however, is the rendering engines browsers use. Should browsers render things that are under other things? No. Do they? Yes, obviously, because it's easier to just render everything "as is" and scale it.

So, this is a bug in browsers, not in the SVG itself.