repeat-auto-fill-005-ref.html (2906B)
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>Reference: repeat(auto-fill / INTEGER, line-names)</title> 9 <link rel="author" title="Mats Palmgren" href="mailto:mats@mozilla.com"> 10 <style> 11 html,body { 12 color:black; background-color:white; font:10px/1 monospace; padding:0; margin:0; 13 } 14 15 .grid { 16 display: inline-grid; 17 grid-auto-columns: 20px; 18 background: lightgrey; 19 } 20 21 .subgrid { 22 display: grid; 23 grid: auto / subgrid; 24 grid-column: 2 / span 4; 25 background: black; 26 } 27 28 item { 29 min-width: 0; 30 min-height: 10px; 31 background: grey; 32 } 33 34 </style> 35 </head> 36 <body> 37 38 <div class="grid"> 39 <div class="subgrid"> 40 <item style="grid-column:1 / 5"></item> 41 </div> 42 </div> 43 44 <div class="grid"> 45 <div class="subgrid"> 46 <item style="grid-column:1 / 5"></item> 47 </div> 48 </div> 49 50 <div class="grid"> 51 <div class="subgrid"> 52 <item style="grid-column:1 / 2"></item> 53 </div> 54 </div> 55 56 <div class="grid"> 57 <div class="subgrid"> 58 <item style="grid-column:2 / 5"></item> 59 </div> 60 </div> 61 62 <div class="grid"> 63 <div class="subgrid"> 64 <item style="grid-column:2 / 4"></item> 65 </div> 66 </div> 67 68 <div class="grid"> 69 <div class="subgrid"> 70 <item style="grid-column:3 / 4"></item> 71 </div> 72 </div> 73 74 <div class="grid"> 75 <div class="subgrid"> 76 <item style="grid-column:1 / 2"></item> 77 </div> 78 </div> 79 80 <div class="grid"> 81 <div class="subgrid"> 82 <item style="grid-column:1 / 4"></item> 83 </div> 84 </div> 85 86 <div class="grid"> 87 <div class="subgrid"> 88 <item style="grid-column:1 / 5"></item> 89 </div> 90 </div> 91 92 <div class="grid"> 93 <div class="subgrid"> 94 <item style="grid-column:1 / 2"></item> 95 </div> 96 </div> 97 98 <div class="grid"> 99 <div class="subgrid"> 100 <item style="grid-column:1 / 2"></item> 101 </div> 102 </div> 103 104 <div class="grid"> 105 <div class="subgrid"> 106 <item style="grid-column:1 / 5"></item> 107 </div> 108 </div> 109 110 <div class="grid"> 111 <div class="subgrid"> 112 <item style="grid-column:2 / 5"></item> 113 </div> 114 </div> 115 116 <div class="grid"> 117 <div class="subgrid"> 118 <item style="grid-column:2 / 3"></item> 119 </div> 120 </div> 121 122 <div class="grid"> 123 <div class="subgrid"> 124 <item style="grid-column:1 / 5"></item> 125 </div> 126 </div> 127 128 <div class="grid"> 129 <div class="subgrid"> 130 <item style="grid-column:1 / 5"></item> 131 </div> 132 </div> 133 134 <div class="grid"> 135 <div class="subgrid"> 136 <item style="grid-column:1 / 5"></item> 137 </div> 138 </div> 139 140 <div class="grid"> 141 <div class="subgrid"> 142 <item style="grid-column:1 / 5"></item> 143 </div> 144 </div> 145 146 <div class="grid"> 147 <div class="subgrid"> 148 <item style="grid-column:1 / 5"></item> 149 </div> 150 </div> 151 152 <div class="grid"> 153 <div class="subgrid"> 154 <item style="grid-column:1 / 5"></item> 155 </div> 156 </div> 157 158 <div class="grid"> 159 <div class="subgrid"> 160 <item style="grid-column:1 / 2"></item> 161 </div> 162 </div> 163 164 </body> 165 </html>