| OLD | NEW |
| 1 <style> | 1 <style> |
| 2 body { margin: 0; color: lightgreen; font-family: Ahem; font-size: 20px; } | 2 body { margin: 0; color: lightgreen; font-family: Ahem; font-size: 20px; } |
| 3 | 3 |
| 4 .square { | 4 .square { |
| 5 width: 30px; | 5 width: 30px; |
| 6 height: 30px; | 6 height: 30px; |
| 7 background-color: lightyellow; | 7 background-color: lightyellow; |
| 8 margin: 20px; | 8 margin: 20px; |
| 9 float: left; | 9 float: left; |
| 10 padding: 5px; | 10 padding: 5px; |
| 11 } | 11 } |
| 12 | 12 |
| 13 .rounded { | 13 .rounded { |
| 14 -webkit-border-radius: 10px; | 14 -webkit-border-radius: 10px; |
| 15 } | 15 } |
| 16 | 16 |
| 17 .transform1 { | 17 .transform1 { |
| 18 -webkit-transform: rotate(45deg); | 18 transform: rotate(45deg); |
| 19 } | 19 } |
| 20 | 20 |
| 21 .transform2 { | 21 .transform2 { |
| 22 -webkit-transform: scale(0.5, 1); | 22 transform: scale(0.5, 1); |
| 23 } | 23 } |
| 24 | 24 |
| 25 .transform3 { | 25 .transform3 { |
| 26 -webkit-transform: rotate(45deg) scale(0.5, 1); | 26 transform: rotate(45deg) scale(0.5, 1); |
| 27 } | 27 } |
| 28 | 28 |
| 29 .transform4 { | 29 .transform4 { |
| 30 -webkit-transform: skewX(45deg); | 30 transform: skewX(45deg); |
| 31 } | 31 } |
| 32 | 32 |
| 33 .shadow1 { | 33 .shadow1 { |
| 34 -webkit-box-shadow: black 10px 10px 0; | 34 -webkit-box-shadow: black 10px 10px 0; |
| 35 } | 35 } |
| 36 | 36 |
| 37 .shadow2 { | 37 .shadow2 { |
| 38 -webkit-box-shadow: black 10px 10px 10px; | 38 -webkit-box-shadow: black 10px 10px 10px; |
| 39 } | 39 } |
| 40 | 40 |
| (...skipping 42 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 83 <div class="square text-shadow2 transform1">X</div> | 83 <div class="square text-shadow2 transform1">X</div> |
| 84 <div class="square text-shadow2 transform2">X</div> | 84 <div class="square text-shadow2 transform2">X</div> |
| 85 <div class="square text-shadow2 transform3">X</div> | 85 <div class="square text-shadow2 transform3">X</div> |
| 86 <div class="square text-shadow2 transform4">X</div> | 86 <div class="square text-shadow2 transform4">X</div> |
| 87 <div style="clear: both;"></div> | 87 <div style="clear: both;"></div> |
| 88 <div class="square text-shadow3">X</div> | 88 <div class="square text-shadow3">X</div> |
| 89 <div class="square text-shadow3 transform1">X</div> | 89 <div class="square text-shadow3 transform1">X</div> |
| 90 <div class="square text-shadow3 transform2">X</div> | 90 <div class="square text-shadow3 transform2">X</div> |
| 91 <div class="square text-shadow3 transform3">X</div> | 91 <div class="square text-shadow3 transform3">X</div> |
| 92 <div class="square text-shadow3 transform4">X</div> | 92 <div class="square text-shadow3 transform4">X</div> |
| OLD | NEW |