grid-item-dir-001-ref.html (1113B)
1 <!DOCTYPE HTML> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <style type="text/css"> 6 .grid { 7 border: 1px solid gray; 8 font-size: 0; 9 } 10 .grid > div { 11 display: inline-block; 12 margin: 2px; 13 } 14 #a { background: #006; height: 46px; width: 96px; } 15 #b { background: #009; height: 46px; width: 146px; } 16 #c { background: #00c; height: 46px; width: 46px; } 17 #d { background: #00f; height: 46px; width: 16px; } 18 #e { background: #060; height: 96px; width: 96px; } 19 #f { background: #090; height: 96px; width: 146px; } 20 #g { background: #0c0; height: 96px; width: 46px; } 21 #h { background: #0f0; height: 96px; width: 16px; } 22 #i { background: #600; height: 16px; width: 96px; } 23 #j { background: #900; height: 16px; width: 146px; } 24 #k { background: #c00; height: 16px; width: 46px; } 25 #l { background: #f00; height: 16px; width: 16px; } 26 </style> 27 </head> 28 29 <body> 30 <div class=grid> 31 <div id=a></div> 32 <div id=b></div> 33 <div id=c></div> 34 <div id=d></div><br> 35 <div id=e></div> 36 <div id=f></div> 37 <div id=g></div> 38 <div id=h></div><br> 39 <div id=i></div> 40 <div id=j></div> 41 <div id=k></div> 42 <div id=l></div> 43 </div> 44 </body> 45 </html>