layout/reftests/w3c-css/submitted/flexbox/flexbox-baseline-multi-item-vert-1-ref.html

changeset 0
6474c204b198
     1.1 --- /dev/null	Thu Jan 01 00:00:00 1970 +0000
     1.2 +++ b/layout/reftests/w3c-css/submitted/flexbox/flexbox-baseline-multi-item-vert-1-ref.html	Wed Dec 31 06:09:35 2014 +0100
     1.3 @@ -0,0 +1,51 @@
     1.4 +<!DOCTYPE html>
     1.5 +<!--
     1.6 +     Any copyright is dedicated to the Public Domain.
     1.7 +     http://creativecommons.org/publicdomain/zero/1.0/
     1.8 +-->
     1.9 +<!-- Reference case, using inline-block instead of inline-flex, and with the
    1.10 +     inline-blocks manually positioned with "vertical-align:top" and
    1.11 +     margin-top.
    1.12 +-->
    1.13 +<html>
    1.14 +<head>
    1.15 +  <title>CSS Reftest Reference</title>
    1.16 +  <link rel="author" title="Daniel Holbert" href="mailto:dholbert@mozilla.com">
    1.17 +  <meta charset="utf-8">
    1.18 +  <link rel="stylesheet" type="text/css" href="support/ahem.css" />
    1.19 +  <style>
    1.20 +    body {
    1.21 +      margin: 0;
    1.22 +      font: 20px Ahem;
    1.23 +      line-height: 20px;
    1.24 +      /* Baseline is 0.8em = 16px from top */
    1.25 +    }
    1.26 +    .flexContainer {
    1.27 +      display: inline-block;
    1.28 +      background: lightblue;
    1.29 +    }
    1.30 +    .smallFont {
    1.31 +      font-size: 10px;
    1.32 +      line-height: 10px;
    1.33 +      /* Baseline is 0.8em = 8px from top */
    1.34 +    }
    1.35 +    .bigFont {
    1.36 +      font-size: 20px;
    1.37 +      line-height: 20px;
    1.38 +      /* Baseline is 0.8em = 16px from top */
    1.39 +    }
    1.40 +    * { vertical-align: top }
    1.41 +  </style>
    1.42 +</head>
    1.43 +<body>
    1.44 +  a
    1.45 +  <div class="flexContainer" style="margin-top: 8px">
    1.46 +    <div class="smallFont">b</div
    1.47 +    ><div class="bigFont">c</div>
    1.48 +  </div>
    1.49 +  <div class="flexContainer">
    1.50 +    <div class="bigFont">d</div
    1.51 +    ><div class="smallFont">e</div>
    1.52 +  </div>
    1.53 +</body>
    1.54 +</html>

mercurial