I can't understand why the code below isn't properly rendered on iPad (Safari and Chrome) while it's ok on iPhone (Safari), Android, pc.
The button is there on iPad* -- if I tap in the bottom right corner actually I trigger the action -- just the button is not visible.
I use linux, so debugging on iPad came out to be tough... any advice?
<div id="print-button">
<svg width="100%" height="100%" xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:svgjs="http://svgjs.com/svgjs" viewBox="0 0 104 104">
<circle r="50" cx="50" cy="50"></circle>
<path d="M25 ... " transform="matrix(0.65,0,0,0.65,17.5,17.5)"></path>
</svg>
</div>
<style>
#print-button {
width: 5.5rem;
height: 5.5rem;
cursor: pointer;
position: fixed;
right: 2%;
bottom: 2%;
}
</style>
(*) sorry for providing the real link rather than recreating the whole thing in a js fiddle, I hope it does not break any rule.
About this being a duplicate question of ... (see comment below)