tor-browser

The Tor Browser
git clone https://git.dasho.dev/tor-browser.git
Log | Files | Refs | README | LICENSE

flexbox-table-flex-items-1-ref.html (2144B)


      1 <!DOCTYPE HTML>
      2 <!--
      3     Any copyright is dedicated to the Public Domain.
      4     http://creativecommons.org/publicdomain/zero/1.0/
      5 -->
      6 <html><head>
      7  <meta charset="utf-8">
      8  <title>CSS Flexbox Reference: caption size test for table flex items</title>
      9  <link rel="author" title="Mats Palmgren" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1334403">
     10  <style type="text/css">
     11 * { vertical-align: top; }
     12 .flex {
     13  display: inline-flex;
     14  border: 3px solid grey;
     15  height: 73px;
     16  width: 110px;
     17  align-items: start;
     18 }
     19 
     20 table {
     21  border: 1px solid;
     22  padding: 0;
     23  margin: 0;
     24  background: lightgrey;
     25  flex: auto;
     26  min-width: 0;
     27  min-height: 0;
     28  width: 32px;
     29  height: 22px;
     30 }
     31 
     32 caption { border: 1px dashed blue; height: 16px; }
     33 t { display:block; width:30px; height:20px; }
     34 i:nth-of-type(1) { width:10px; height:20px; }
     35 i:nth-of-type(2) { width:20px; height:10px; }
     36 
     37 .hma10 { margin: 7px 3px 1px auto; }
     38 .hmaa  { margin: 7px auto 1px auto; }
     39 .vma10 { margin: auto 7px 3px 1px; }
     40 .vmaa  { margin: auto 7px auto 1px; }
     41 
     42 .vr { writing-mode: vertical-rl; }
     43  </style>
     44 </head>
     45 <body>
     46 
     47 <div class="flex"><i></i><table cellpadding=0 cellspacing=0 class="hma10"><caption></caption><td><t></t></td></table></div>
     48 <div class="flex"><i></i><table cellpadding=0 cellspacing=0 class="hmaa"><caption></caption><td><t></t></td></table><i></i></div>
     49 
     50 <div class="flex"><i></i><table cellpadding=0 cellspacing=0 class="vma10"><caption></caption><td><t></t></td></table><i></i></div>
     51 <div class="flex"><i></i><table cellpadding=0 cellspacing=0 class="vmaa"><caption></caption><td><t></t></td></table><i></i></div>
     52 
     53 <div class="flex"><i></i><table cellpadding=0 cellspacing=0><caption class="hma10"></caption><td><t></t></td></table><i></i></div>
     54 <div class="flex"><i></i><table cellpadding=0 cellspacing=0><caption class="hmaa"></caption><td><t></t></td></table><i></i></div>
     55 <div class="flex"><i></i><table cellpadding=0 cellspacing=0><caption class="vma10"></caption><td><t></t></td></table><i></i></div>
     56 <div class="flex"><i></i><table cellpadding=0 cellspacing=0><caption class="vmaa"></caption><td><t></t></td></table><i></i></div>
     57 
     58 </body>
     59 </html>