shape-outside-empty-inset-5.html (702B)
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta http-equiv="content-type" content="text/html; charset=UTF-8"> 5 <title>Shape-outside empty vertical flat inset, acts like a line</title> 6 <style> 7 body { 8 line-height: 0; 9 } 10 .container { 11 width: 600px; 12 } 13 box { 14 display: inline-block; 15 background-color: blue; 16 width: 100px; 17 height: 20px; 18 } 19 .shape { 20 float: left; 21 width: 200px; 22 height: 180px; 23 shape-outside: inset(0% 5% 0% 95%); 24 } 25 </style> 26 </head> 27 <body> 28 <div class="container"> 29 <div class="shape"></div> 30 <box></box><br> 31 <box></box><br> 32 <box></box><br> 33 <box></box><br> 34 <box></box><br> 35 <box></box><br> 36 <box></box><br> 37 <box></box><br> 38 <box></box><br> 39 </div> 40 </body> 41 </html>