The Tor Browser: layout/reftests/flexbox/flexbox-align-self-baseline-horiz-3.xhtml@7e26c7da4463

     1 <?xml version="1.0" encoding="UTF-8"?>

     2 <!--

     3      Any copyright is dedicated to the Public Domain.

     4      http://creativecommons.org/publicdomain/zero/1.0/

     5 -->

     6 <!-- Testcase for behavior of the 'baseline' value for align-items (and

     7      align-self, implicitly).  This test has various types of baseline-aligned

     8      content, and the flexbox's vertical size depends on the aggregate

     9      post-alignment height of its children.

    11      This test checks baseline-alignment for text <button>, for

    12      various <input> fields, for <label>, and for <fieldset>.

    13 -->

    14 <html xmlns="http://www.w3.org/1999/xhtml">

    15   <head>

    16     <style>

    17       .flexbox {

    18         display: flex;

    19         align-items: baseline;

    20         border: 1px dashed blue;

    21         font: 14px sans-serif;

    22       }

    24       .big {

    25         height: 100px;

    26         font: 24px sans-serif;

    27         margin-top: 20px;

    28       }

    30       .lime   { background: lime;   }

    31       .pink   { background: pink;   }

    32       .aqua   { background: aqua;   }

    33    </style>

    34   </head>

    35   <body>

    36     <div class="flexbox">

    37       <div class="lime">text</div>

    38       <button>btn</button>

    39       <input type="radio"/>

    40       <input type="checkbox"/>

    41       <label class="pink">label</label>

    42       <label class="aqua">lab<br/>el</label>

    43       <fieldset>field<br/>set</fieldset>

    44       <fieldset><legend>leg</legend>field<br/>set</fieldset>

    45       <fieldset><legend>leg<br/>end</legend>field<br/>set</fieldset>

    46     </div>

    47   </body>

    48 </html>

The Tor Browser / file revision