Bug 279054 – When zooming out, the `box-shadow` spread-radius expands more than the defined value.

• Status: NEW
• Component: Layout and Rendering

[Moubeen awan]

Created attachment 472415 [details]
For information: The browser is zoomed out t0 75%.

We’ve implemented borders using box-shadows in our project. 
For example:

```
HTML:
<div class="alert">Please be alert!</div>

CSS:
.alert {
    width: 60px;
    height: 60px;
    box-shadow: 0 0 0 1px #949a9e;
}
```
Here, the div has a 1px border created with box-shadow.

ACTUAL RESULT:
When zooming out in Safari browser (version 17.1), the spread-radius of the box-shadow extends beyond the defined 1px, sometimes expanding more from the top, left, and right, and other times from the right and bottom.

EXPECTED RESULT:
The box-shadow should not spread beyond the defined 1px.
Please refer to the attachment for further details.

[Radar WebKit Bug Importer]

<rdar://problem/135217881>

[Simon Fraser (smfr)]

This is a result of pixel snapping (attempting to align edges with device pixel boundaries).

[Moubeen awan]

@simnon is this something should be fixed is Safari browser?

[Moubeen awan]

(In reply to Moubeen awan from comment #3)
> @simnon is this something should be fixed by Safari browser?