NEW301926
Hairline crack space between bottom border and canvas 
https://bugs.webkit.org/show_bug.cgi?id=301926
Summary Hairline crack space between bottom border and canvas
Mike McCollister
Reported 2025-11-04 04:43:33 PST
HTML canvas on iOS/iPadOS devices shows a small gap between the canvas and the bottom border. I've fixed this problem in the past with a div by adding "display: block;" but that does not work on the canvas. I asked about this on StackOverflow and someone suggested that this is a bug in Webkit due to "antialiasing rounding issue, caused by the default user-agent rules". See https://stackoverflow.com/questions/79807971/how-to-get-rid-of-unwanted-space-between-bottom-border-and-canvas-on-ios-ipados. I have verified that this happens on iOS/iPadOS 26.0.1, 26.1 and have seen the issue on iOS/iPadOS 18.6 as well. I have not tested this on macOS.
Attachments
Test HTML file to show issue. (788 bytes, text/html)
2025-11-04 09:53 PST, Mike McCollister 		no flags
Details
View All Add attachment proposed patch, testcase, etc.
Mike McCollister
Comment 1 2025-11-04 09:53:41 PST
Created attachment 477290 [details] Test HTML file to show issue.
Alexey Proskuryakov
Comment 2 2025-11-05 16:40:18 PST
I can reproduce this on macOS too. Happens when the canvas is taller than 16 px, doesn't happen with smaller canvases. May be the same as bug 257325, but this test is simpler .
Radar WebKit Bug Importer
Comment 3 2025-11-11 04:44:11 PST
<rdar://problem/164472788>
Note You need to log in before you can comment on or make changes to this bug.