OLD | NEW |
(Empty) | |
| 1 html, body { |
| 2 color: black; |
| 3 background-color: white; |
| 4 font-size: 16px; |
| 5 padding: 0; |
| 6 margin: 0; |
| 7 } |
| 8 |
| 9 body { color: red; } |
| 10 |
| 11 .table { |
| 12 display: table; |
| 13 border-collapse: collapse; |
| 14 border: blue solid 1pt; |
| 15 } |
| 16 |
| 17 .itable { display: inline-table; } |
| 18 .caption { display: table-caption; } |
| 19 .cell { |
| 20 display: table-cell; |
| 21 border: inherit; |
| 22 } |
| 23 .row { |
| 24 display: table-row; |
| 25 border: green dashed 1pt; |
| 26 } |
| 27 .rowg { display: table-row-group; } |
| 28 .head { display: table-header-group; } |
| 29 .foot { display: table-footer-group; } |
| 30 .col { display: table-column; } |
| 31 .colg { display: table-column-group; } |
| 32 .flex { display: flex; } |
| 33 .iflex { display: inline-flex; } |
| 34 .li { display: list-item; } |
| 35 .ib { display: inline-block; } |
| 36 .inline { display: inline; } |
| 37 .columns { columns: 2; height: 4em; } |
| 38 .contents { |
| 39 display: contents; |
| 40 align-items: inherit; |
| 41 justify-items:inherit; |
| 42 } |
| 43 .c1 { color: lime; } |
| 44 .c2 { background: blue; color: pink; } |
| 45 .c3 { color: teal; } |
| 46 .c4 { color: green; } |
| 47 .c5 { color: silver; } |
| 48 .c6 { color: cyan; } |
| 49 .c7 { color: magenta; } |
| 50 .c8 { color: yellow; } |
| 51 .c9 { color: grey; } |
| 52 .c10{ color: black; } |
| 53 .b { background: inherit; } |
| 54 |
| 55 /** This is the only difference between references and non-reference styles */ |
| 56 .ref .c2 { background: transparent; } |
| 57 .ref .b { background:blue; } |
| 58 .ref div.contents { display: block; } |
| 59 .ref span.contents { display: inline; } |
OLD | NEW |