flexbox-align-self-baseline-horiz-4-ref.xhtml (945B)
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 <!-- Reference case for behavior of the 'baseline' value for align-items and 7 align-self. 8 --> 9 <html xmlns="http://www.w3.org/1999/xhtml"> 10 <head> 11 <style> 12 div.flexbox { 13 display: block; 14 border: 1px dashed blue; 15 font: 14px sans-serif; 16 } 17 18 div { display: inline-block; } 19 table { 20 display: inline-table; 21 margin: 1px; /* to fix fuzziness from text overlapping table border */ 22 } 23 24 .lime { background: lime; } 25 .pink { background: pink; } 26 .aqua { background: aqua; } 27 </style> 28 </head> 29 <body> 30 <div class="flexbox"> 31 <div class="lime">text</div 32 ><table class="pink" border="1"> 33 <tr><td>tr1</td></tr> 34 <tr><td>tr2</td></tr> 35 </table> 36 </div> 37 </body> 38 </html>