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.
10
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      }
23
24      .big {
25        height: 100px;
26        font: 24px sans-serif;
27        margin-top: 20px;
28      }
29
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      <label class="pink">label</label>
40      <label class="aqua">lab<br/>el</label>
41      <fieldset>field<br/>set</fieldset>
42      <fieldset><legend>leg</legend>field<br/>set</fieldset>
43      <fieldset><legend>leg<br/>end</legend>field<br/>set</fieldset>
44    </div>
45  </body>
46</html>
47