Posted by bernieful on 07/31/05 12:50

Safari is a standards-compliant browser, like Firefox, right? So they
should render pages identically (ignoring font differences, and maybe
something else I can't think of).

Well my page (http://www.rf3000.org/maps/test.html) renders perfectly
in Firefox and IE but in Safari, the nine images on the left are placed
incorrectly. To save you crawling through the script which generates
them, they, and the orange corner markers which should line up
perfectly but don't, are positioned within a layer
(relatively-positioned div with an explicit z-index) from the bottom
and left edges in multiples of 100%/3 and have widths and heights of
100%/3.

Instead of what should in theory (and in other browsers) be displayed
the images are several pixels downwards and leftwards of where they
should be. The images which form the orange corner markers are
positioned in EXACTLY the same way except there is an unstyled span tag
around the groups whereas there is an anchor around each square image.

Here is the styling of an orange corner segment image (taken directly
from the DOM)
z-index: 3; position: absolute; bottom: 33.3333%; right: 33.3333%;

Here is that of a square image
width: 33.3333%; height: 33.3333%; position: absolute; bottom:
33.3333%; left: 33.3333%;

The bottom-left corners of these elements don't seem to line up in
Safari.

The most any of these images should be out by is a single pixel, with a
worst-case rounding error.

[Back to original message]