OLD | NEW |
1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
2 <html lang="en"> | 2 <html lang="en"> |
3 <head> | 3 <head> |
4 <style> | 4 <style> |
5 .region, .content { | 5 .region, .content { |
6 font: 50px/1 Ahem, sans-serif; | 6 font: 50px/1 Ahem, sans-serif; |
7 } | 7 } |
8 .region { | 8 .region { |
9 width: 100px; | 9 width: 100px; |
10 height: 100px; | 10 height: 100px; |
11 -webkit-shape-inside: rectangle(0, 0, 100%, 100%); | 11 shape-inside: rectangle(0, 0, 100%, 100%); |
12 } | 12 } |
13 .content * { | 13 .content * { |
14 color: green; | 14 color: green; |
15 width: 100px; | 15 width: 100px; |
16 overflow-wrap: break-word; | 16 overflow-wrap: break-word; |
17 } | 17 } |
18 .inline-block.content * { | 18 .inline-block.content * { |
19 display: inline-block; | 19 display: inline-block; |
20 } | 20 } |
21 .float.content * { | 21 .float.content * { |
(...skipping 85 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
107 </div> | 107 </div> |
108 | 108 |
109 <p>Grid</p> | 109 <p>Grid</p> |
110 <div class='region grid'> | 110 <div class='region grid'> |
111 <div class='content grid'> | 111 <div class='content grid'> |
112 <div>xxxx</div> | 112 <div>xxxx</div> |
113 </div> | 113 </div> |
114 </div> | 114 </div> |
115 </body> | 115 </body> |
116 </html> | 116 </html> |
OLD | NEW |