Question:I set up a div, the orange one
and an SVG container absolutely positioned at the bottom. The SVG is just a triangle path in the middle of a 10×700 viewport
I tried almost everything.
The problem is that if I do
Am I missing something?
Answer:This may sound weird, and it indeed seems to be a rendering bug, but the way I solve it is to set a -1px negative margin on the SVG. In your case, like:
If this still cuts stuff off, my guess is you can experiment with smaller (perhaps half-pixel even) values, but I consider the single pixel value as the smallest cross-browser-safe unit.
Additionally, you can try adding one pixel to both your SVG’s (viewbox) width and height, and then apply this trick in CSS.
If you have better answer, please add a comment about this, thank you!