tor-browser

The Tor Browser
git clone https://git.dasho.dev/tor-browser.git
Log | Files | Refs | README | LICENSE

transform-inherit-001.html (1453B)


      1 <!DOCTYPE html>
      2 <html>
      3  <head>
      4    <title>CSS Test (Transforms): 'inherit' and em</title>
      5    <link rel="author" title="Aryeh Gregor" href="mailto:ayg@aryeh.name">
      6    <link rel="reviewer" title="Apple Inc." href="http://www.apple.com">
      7    <link rel="help" href="http://www.w3.org/TR/css-transforms-1/#transform-property">
      8    <meta name="assert" content='The &apos;transform&apos; property&apos;s
      9    computed value (which is what&apos;s inherited if &apos;inherit&apos; is
     10    specified) is defined as "As specified, but with relative lengths converted
     11    into absolute lengths."  In this test, a parent element has a transform of
     12    1em with a font-size of 25px, and the child has "transform: inherit".
     13    Since the relative length of 1em is converted to an absolute length of 25px
     14    before inheritance, the child should be translated by a further 25px, for a
     15    total of 50px, even though its font-size is 100px.  An implementation that
     16    incorrectly inherited 1em without converting it to an absolute length first
     17    would translate by 125px.'>
     18    <link rel="match" href="transform-inherit-ref.html">
     19    <style>
     20      body {
     21        font-size: 25px;
     22        transform: translate(1em, 1em);
     23        overflow: hidden;
     24      }
     25      div {
     26        font-size: 100px;
     27        transform: inherit;
     28        height: 100px;
     29        width: 100px;
     30        background: blue;
     31      }
     32    </style>
     33  </head>
     34  <body>
     35    <div></div>
     36  </body>
     37 </html>