| 12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667 |
- <?xml version="1.0" encoding="UTF-8"?>
- <!--
- Any copyright is dedicated to the Public Domain.
- http://creativecommons.org/publicdomain/zero/1.0/
- -->
- <!-- Reference case for behavior of the 'baseline' value for align-items and
- align-self.
- NOTE: For multi-line 'display: block' flex items in the testcase, we use
- an inline-table here in the reference case, so that we get first-line
- baseline alignment. (If we used an inline-block instead, that would give
- us *last-line* baseline alignment.)
- -->
- <html xmlns="http://www.w3.org/1999/xhtml">
- <head>
- <style>
- .flexbox {
- display: block;
- border: 1px dashed blue;
- font: 14px sans-serif;
- }
- div { display: inline-block; }
- table { display: inline-table; }
- .lime { background: lime; }
- .pink { background: pink; }
- .aqua { background: aqua; }
- i { display:inline-block; width:20px; height:2px; background:black; }
- .ref {
- -moz-appearance:none;
- -ms-appearance:none;
- -webkit-appearance:none;
- appearance:none;
- border:none;
- margin:0;
- padding:0;
- border-bottom:2px solid black;
- width:20px;
- }
- </style>
- </head>
- <body>
- <div class="flexbox">
- <div class="lime">text</div
- ><button>btn</button
- ><label class="pink">label</label
- ><table cellspacing="0" cellpadding="0" class="aqua">
- <label>lab<br/>el</label>
- </table
- ><table cellspacing="0" cellpadding="0">
- <fieldset>field<br/>set</fieldset>
- </table
- ><table cellspacing="0" cellpadding="0">
- <fieldset><legend>leg</legend>field<br/>set</fieldset>
- </table
- ><table cellspacing="0" cellpadding="0">
- <fieldset><legend>leg<br/>end</legend>field<br/>set</fieldset>
- </table>
- </div>
- <div class="flexbox" style="font-size:0"><input type="radio"
- /><input type="checkbox"
- /><input type="checkbox" class="ref"/></div>
- </body>
- </html>
|
