tor-browser

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

grid-max-sizing-flex-006-ref.html (1953B)

      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 Grid Test: Testing track flex max-sizing</title>
      9  <link rel="author" title="Mats Palmgren" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1151212">
     10  <style type="text/css">
     11 body,html { color:black; background:white; font-size:8px; line-height:10px; padding:0; margin:0; }
     12 
     13 .grid {
     14  display: grid;
     15  grid-auto-columns: 40px;
     16  border: 3px dashed blue;
     17  width: 720px;
     18 }
     19 
     20 .c1 { grid-row: 1 / span 2; }
     21 .c2 { grid-row: 2 / span 3; }
     22 .c3 { grid-row: 3 / span 1; }
     23 
     24 span {
     25  background: gray;
     26  padding: 1px 3px;
     27  margin: 1px 5px;
     28  min-height: 5px;
     29  justify-self: flex-start;
     30 }
     31 
     32  </style>
     33 </body>
     34 <head>
     35 
     36 <div class="grid" style="grid-template-rows: 3px 6px 9px 6px 3px;">
     37 <span class="c1"></span>
     38 <span class="c2"></span>
     39 <span class="c3"></span>
     40 </div>
     41 
     42 <div class="grid" style="grid-template-rows: 2.25px 4.5px 6.75px 4.5px 2.25px;">
     43 <span class="c1"></span>
     44 <span class="c2"></span>
     45 <span class="c3"></span>
     46 </div>
     47 
     48 <div class="grid" style="grid-template-rows: 9px 18px 27px 18px 9px;">
     49 <span class="c1"></span>
     50 <span class="c2"></span>
     51 <span class="c3"></span>
     52 </div>
     53 
     54 <div class="grid" style="grid-template-rows: 9px 18px 27px 18px 9px;">
     55 <span class="c1"></span>
     56 <span class="c1"></span>
     57 <span class="c1"></span>
     58 <span class="c2"></span>
     59 <span class="c3"></span>
     60 </div>
     61 
     62 <div class="grid" style="grid-template-rows: 18px 36px 54px 36px 18px;">
     63 <span class="c1"></span>
     64 <span class="c2"></span>
     65 <span class="c3"></span>
     66 </div>
     67 
     68 <div class="grid" style="grid-template-rows: 18px 36px 54px 36px 18px;">
     69 <span class="c1"></span>
     70 <span class="c2"></span>
     71 <span class="c3"></span>
     72 </div>
     73 
     74 <div class="grid" style="grid-template-rows: 18px 36px 54px 36px 18px;">
     75 <span class="c1"></span>
     76 <span class="c2"></span>
     77 <span class="c3"></span>
     78 </div>
     79 
     80 </body>
     81 </html>