legend-display-rendering-ref.html (1369B)
1 <!doctype html> 2 <title>Reference for rendered legend and CSS display rendering</title> 3 <style> 4 body { margin: 0; } 5 div { width: 600px; box-sizing: border-box; background: #ddd; border: 1px solid; } 6 .padding { padding-left: 5em; } 7 .margin { margin-left: 5em; } 8 .cell { display: inline-block; width: 50%; } 9 .ruby { display: block; } 10 </style> 11 <div><span class=cell>table</span><span class=cell>table</span></div> 12 <div class=padding>table-row-group</div> 13 <div class=padding>table-header-group</div> 14 <div class=padding>table-footer-group</div> 15 <div class=padding>table-row</div> 16 <div class=margin>table-cell</div> 17 <div class=padding>table-column-group</div> 18 <div class=padding>table-column</div> 19 <div>table-caption</div> 20 <div>flow</div> 21 <div>flow-root</div> 22 <div>run-in</div> 23 <div>inline</div> 24 <div>inline-block</div> 25 <div><span class=cell>inline-table</span><span class=cell>inline-table</span></div> 26 <div><span class=ruby>ruby</span><span class=ruby>ruby</span></div> 27 <div>ruby-base</div> 28 <div>ruby-text</div> 29 <div>ruby-base-container</div> 30 <div>ruby-text-container</div> 31 <div><span class=cell>grid</span><span class=cell>grid</span></div> 32 <div><span class=cell>inline-grid</span><span class=cell>inline-grid</span></div> 33 <div><span class=cell>flex</span><span class=cell>flex</span></div> 34 <div><span class=cell>inline-flex</span><span class=cell>inline-flex</span></div>