| OLD | NEW |
| 1 <!doctype html> | 1 <!doctype html> |
| 2 <meta charset="utf-8"> | 2 <meta charset="utf-8"> |
| 3 <style> | 3 <style> |
| 4 .target { | 4 .target { |
| 5 border: 3px solid skyblue; | 5 border: 3px solid skyblue; |
| 6 width: 100px; | 6 width: 100px; |
| 7 height: 100px; | 7 height: 100px; |
| 8 background-image: linear-gradient(to right, coral, coral); | 8 background-image: linear-gradient(to right, coral, coral); |
| 9 background-size: 20px 20px; | 9 background-size: 20px 20px; |
| 10 background-repeat: no-repeat; | 10 background-repeat: no-repeat; |
| (...skipping 122 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 133 }, [ | 133 }, [ |
| 134 {at: 0, is: 'center center'}, | 134 {at: 0, is: 'center center'}, |
| 135 {at: 0.25, is: 'calc(37.5% + ((100% - 20px) * 0.25)) calc(37.5% + ((100% - 2
0px) * 0.25))'}, | 135 {at: 0.25, is: 'calc(37.5% + ((100% - 20px) * 0.25)) calc(37.5% + ((100% - 2
0px) * 0.25))'}, |
| 136 {at: 0.50, is: 'calc(25% + ((100% - 20px) * 0.5)) calc(25% + ((100% - 20px)
* 0.5))'}, | 136 {at: 0.50, is: 'calc(25% + ((100% - 20px) * 0.5)) calc(25% + ((100% - 20px)
* 0.5))'}, |
| 137 {at: 0.75, is: 'calc(12.5% + ((100% - 20px) * 0.75)) calc(12.5% + ((100% - 2
0px) * 0.75))'}, | 137 {at: 0.75, is: 'calc(12.5% + ((100% - 20px) * 0.75)) calc(12.5% + ((100% - 2
0px) * 0.75))'}, |
| 138 {at: 1, is: 'right 20px bottom 20px'}, | 138 {at: 1, is: 'right 20px bottom 20px'}, |
| 139 ]); | 139 ]); |
| 140 | 140 |
| 141 </script> | 141 </script> |
| 142 </body> | 142 </body> |
| OLD | NEW |