[Webkit-unassigned] [Bug 100865] New: Drop support for dpi and dpcm units (keep dppx)

[bugzilla-daemon at webkit.org]

https://bugs.webkit.org/show_bug.cgi?id=100865

           Summary: Drop support for dpi and dpcm units (keep dppx)
           Product: WebKit
           Version: 528+ (Nightly build)
          Platform: Unspecified
        OS/Version: Unspecified
            Status: NEW
          Severity: Normal
          Priority: P2
         Component: CSS
        AssignedTo: webkit-unassigned at lists.webkit.org
        ReportedBy: johnme at chromium.org
                CC: koivisto at iki.fi, tony at chromium.org, abarth at webkit.org,
                    kenneth at webkit.org, peter at chromium.org,
                    tabatkins at google.com, davidbarr at chromium.org,
                    rbyers at chromium.org
            Blocks: 85262,99077,100861


The dpi unit as specified[2] is incredibly confusing.

The iPhone 3G and iPhone 4 are widely known to have 163 ppi and 326 ppi screens respectively. So people are going to write media queries like:

@media (min-resolution: 300dpi) { /* 2x graphics */ }

And this is going to fail. Why? Because the spec[1] defined dpi and dpcm in terms of CSS inches and CSS cm, which are a fixed number of px, rather than based on the physical units. Hence the iPhone 3G and iPhone 4 are actually 96 CSS dpi and 192 CSS dpi respectively[1]!

While authors have just about gotten used to CSS's fixed-size inches and cm, and adapted by simply avoiding all use of those units, it will take a long time for them to realise that dpi and dpcm are similarly broken. This is especially dangerous since the effects of resolution media queries are usually fairly subtle - e.g. images gets slightly sharper/blurrier or more bandwidth-intensive when they are set wrongly, but it's rare to get elements appearing the wrong size or in the wrong place.

To prevent authors shooting themselves in the foot with this counter-intuitive "feature", we should drop support for the dpi and dpcm units before shipping resolution mq/image-resolution, and only support dppx (which does behave sensibly across different resolution devices).

[1]: (in case it's not clear why that is, it's because iPhone 3G and iPhone 4 are 1 dppx and 2 dppx respectively, and the spec[2] hardcodes 1 dppx == 96 CSS dpi, so you have to multiply those values by 96, even though on phones 1 dppx usually means 160 physical ppi, since phones are held closer to the user's eyes, so you need more physical pixels per inch, and for the same reason the CSS px unit represents a smaller physical length on phones than on desktops[3])

[2]: http://dev.w3.org/csswg/css3-values/#resolution

[3]: http://dev.w3.org/csswg/css3-values/#reference-pixel

-- 
Configure bugmail: https://bugs.webkit.org/userprefs.cgi?tab=email
------- You are receiving this mail because: -------
You are the assignee for the bug.