Re: [css3-values] Physical length units

On 2/19/12 1:58 PM, Lea Verou wrote:
> On 19/2/12 22:47, Charles Pritchard wrote:
>> It's no fun though. About 15 lines of CSS.
> What 15 lines of CSS do you have in mind? When I needed to detect 
> physical DPI or physical screen size in Gecko, I had to resort to 
> JavaScript & matchMedia. 

Here's part of the chain I use. With webkit, I use a nasty hack 
comparing outer and inner client width.
There are a few areas in CSSOM that could be a little more 
author-friendly. I suppose that's what this thread is about.

I've not checked how matchMedia is working in the current FF. It -may- 
have been a different code path  (and not worked) in earlier versions. 
matchMedia doesn't work for browser zoom in WebKit (last I checked).


/* CSS feature testing */
#canvas.CompatibilityScreen {
         -webkit-transform: scale(1,1);
         -moz-transform: scale(1,1);
         -ms-transform: scale(1,1);
         -o-transform: scale(1,1);
         transform: scale(1,1);
}

/*
// http://kb.mozillazine.org/Toolkit.zoomManager.zoomValues
*/
#canvas.CompatibilityMozScreen { width: 1px; }
@media all and (min--moz-device-pixel-ratio: 1.1) {
  #canvas.CompatibilityMozScreen { width: 1.1px; }
}
@media all and (min--moz-device-pixel-ratio: 1.2) {
  #canvas.CompatibilityMozScreen { width: 1.2px; }
}
@media all and (min--moz-device-pixel-ratio: 1.33) {
  #canvas.CompatibilityMozScreen { width: 1.33px; }
}
@media all and (min--moz-device-pixel-ratio: 1.5) {
  #canvas.CompatibilityMozScreen { width: 1.5px; }
}
@media all and (min--moz-device-pixel-ratio: 1.7) {
  #canvas.CompatibilityMozScreen { width: 1.7px; }
}
@media all and (min--moz-device-pixel-ratio: 2) {
  #canvas.CompatibilityMozScreen { width: 2px; }
}

Received on Sunday, 19 February 2012 22:09:22 UTC