How to workaround "pixel is not a pixel" issue?

There're many resources over web with "pixel is not a pixel" issue explanation but there's no any published ideas how to round this.

Let's say we have a rectangles list with shared css property box-shadow: 1px affects each of them. While on the desktop the list would render fine, on mobile one it wouldn't: some of rectangles would render 2px shadow instead of 1px despite on the set box-shadow property.

The viewport meta tag seems not enough:

<meta name="viewport" content="width=device-width, initial-scale=1">

How to workaround the issue?