Html2canvas: Image with border-radius does't work
Images with border radius appear as a square. I tryed adding 1px border with color and transparent to force the border.
I also tryed with a wrapper div with the border and overflow:hidden, but it doesn't work either.
Is this a bug? There any CSS trick to solve it?
jorgecasar
All 6 comments
by what you said seems to be a bug, but put a test case of the problem to understand how you are working the html.
brcontainer
on 7 Mar 2014
I made this jsfindle but it's not working because of the external images I guess. But it is enough to show an example of what I tested.
Dirty trick: By the moment, I changed the images for background images.
jorgecasar
on 7 Mar 2014
Is really a BUG, not rendering images with border-radius.
The div#test2 can render, but the image overlaps it.
@niklasvh occurs also on 5.0-rc1
brcontainer
on 7 Mar 2014
Should be fixed
niklasvh
on 7 Oct 2014
@niklasvh hello,I use v1.0.0-alpha.10,and I still have this problem~
peterzhai
on 9 Oct 2018
Has this issue been resolved? I am trying to download an image from a canvas element that has a border-radius but the saved image (from canvas.todataurl()) is square.
moothemonkey
on 28 May 2020
Related issues
arzyu
·
3Comments
Josh10101010
·
3Comments
dking3876
·
4Comments
yasergh
·
5Comments
koreanman
·
4Comments