<html>
<head>
<base href="https://bugs.webkit.org/" />
</head>
<body><table border="1" cellspacing="0" cellpadding="8">
<tr>
<th>Bug ID</th>
<td><a class="bz_bug_link
bz_status_NEW "
title="NEW - non-integer transform scale values result in 1px white lines being rendered"
href="https://bugs.webkit.org/show_bug.cgi?id=156130">156130</a>
</td>
</tr>
<tr>
<th>Summary</th>
<td>non-integer transform scale values result in 1px white lines being rendered
</td>
</tr>
<tr>
<th>Classification</th>
<td>Unclassified
</td>
</tr>
<tr>
<th>Product</th>
<td>WebKit
</td>
</tr>
<tr>
<th>Version</th>
<td>Safari 9
</td>
</tr>
<tr>
<th>Hardware</th>
<td>Macintosh
</td>
</tr>
<tr>
<th>OS</th>
<td>OS X 10.9
</td>
</tr>
<tr>
<th>Status</th>
<td>NEW
</td>
</tr>
<tr>
<th>Severity</th>
<td>Normal
</td>
</tr>
<tr>
<th>Priority</th>
<td>P2
</td>
</tr>
<tr>
<th>Component</th>
<td>Layout and Rendering
</td>
</tr>
<tr>
<th>Assignee</th>
<td>webkit-unassigned@lists.webkit.org
</td>
</tr>
<tr>
<th>Reporter</th>
<td>zsolt.ero@gmail.com
</td>
</tr>
<tr>
<th>CC</th>
<td>simon.fraser@apple.com
</td>
</tr></table>
<p>
<div>
<pre>Created <span class=""><a href="attachment.cgi?id=275463" name="attach_275463" title="html reproducing the case">attachment 275463</a> <a href="attachment.cgi?id=275463&action=edit" title="html reproducing the case">[details]</a></span>
html reproducing the case
URLs (if applicable) : <a href="http://playground-leaflet.rhcloud.com/say/1/edit?html,output">http://playground-leaflet.rhcloud.com/say/1/edit?html,output</a>
Other browsers tested: Firefox, Safari, IE
Add OK or FAIL, along with the version, after other browsers where you
have tested this issue:
Safari: FAIL
Firefox: OK
IE: OK
What steps will reproduce the problem?
(1) Open the above URL: <a href="http://playground-leaflet.rhcloud.com/say/1/edit?html,output">http://playground-leaflet.rhcloud.com/say/1/edit?html,output</a> or the attached file.
(2) Look at the rendered black div
What is the expected result?
The rendered black div should be solid, with no 1px white lines visible.
What happens instead?
There are 1px white lines between the 256x256 image tiles. Firefox / IE renders it correctly, with no white lines.
Please provide any additional information below. Attach a screenshot if
possible.
This is a critical issue for the Leaflet interactive map library, used by millions of users, which we cannot fix without upstream help.
On non-integer zoom levels (thus non-integer transform scale values) in Webkit browsers, there are 1px white lines appearing on the map. Firefox and IE render the same map perfectly.
This is a minimal, CSS-only reproduction case of the issue.</pre>
</div>
</p>
<hr>
<span>You are receiving this mail because:</span>
<ul>
<li>You are the assignee for the bug.</li>
</ul>
</body>
</html>