Discrepancy in Screen.width definition: CSS pixels vs Physical pixels

[Falcon1968-byte]

MDN URL

https://developer.mozilla.org/en-US/docs/Web/API/Screen/width

What specific section or headline is this issue about?

The Screen.width read-only property returns the width of the screen in CSS pixels.

What information was incorrect, unhelpful, or incomplete?

Description of the problem:
The current documentation states that Screen.width returns the width of the screen in CSS pixels, but testing in real-world scenarios suggests otherwise. In practice, Screen.width appears to return the physical pixels of the device, not CSS pixels.

For example:

A device with a resolution of 360 x 640 pixels and a Device Pixel Ratio (DPR) of 2.

Screen.width = 360 (physical pixels)
CSS pixels are calculated as Screen.width / DPR = 180 (CSS pixels).
This behavior aligns with how CSS pixels are derived (dividing physical pixels by the DPR) and contradicts the claim that Screen.width already represents CSS pixels.

Proposed Correction:
Update the documentation to clarify that:

Screen.width represents physical pixels, and CSS pixels can be derived by dividing this value by the DPR (window.devicePixelRatio).
This adjustment will align the documentation with real-world behavior and help developers avoid confusion.

What did you expect to see?

I expected the documentation to clarify that Screen.width represents the physical pixels of the screen, and that CSS pixels can be calculated by dividing this value by the Device Pixel Ratio (DPR). This would better align with real-world behavior observed during testing

Do you have any supporting links, references, or citations?

no

Do you have anything more you want to share?

no

MDN metadata

Page report details

• Folder: en-us/web/api/screen/width
• MDN URL: https://developer.mozilla.org/en-US/docs/Web/API/Screen/width
• GitHub URL: https://github.com/mdn/content/blob/main/files/en-us/web/api/screen/width/index.md
• Last commit: f2f9346
• Document last modified: 2023-04-08T06:00:31.000Z