Re: [css3-values] viewport units (v*) and zoom

Indeed, you just discovered what an implementation bug. This implementation 
bug occurs when the 'v*' units are converted to pixels in a font-size 
declaration. Here's a reduced test case for the problem:

<!doctype html>
<html>
    <head>
        <title>Invalid VM/VH to PX conversion in FONT-SIZE only</title>
        <style>

            html, body { margin: 0px; padding: 0px; }
            html { font-size: 100vh; line-height: 0px; overflow: hidden; 
background: darkred; }
            div { position: absolute; top: 0px; }
            #vh { height: 100vh; width: 100vw; background: red; }
            #em { height: 1rem; font-size: 100vw; width: 1em; background: 
lime; }

        </style>
    </head>
    <body>
        <!-- set this page at 50% zoom level; you should not see any red on 
this page -->
        <div id="vh"></div>
        <div id="em"></div>
    </body>
</html>

It seems there's already a webkit bug open for this issue: 
https://bugs.webkit.org/show_bug.cgi?id=87846 (maybe you want to +1 it). If 
you are ok with this, I can report the bug on Connect for IE (I'll link this 
conversation).

Nice find,
François 

Received on Monday, 20 August 2012 16:29:04 UTC