Differences

This shows you the differences between two versions of the page.

--- ideas:css3-exclusions-use-cases [2011/10/28 10:09] – created vhardy
+++ ideas:css3-exclusions-use-cases [2011/10/28 10:30] – [CSS Exclusions and Shapes] vhardy
@@ Line 422: / Line 422: @@
 <html>
 <head>
+        <circle id="circle" cx="50%" cy="50%" width="50%" height="50%" />
 	<style type="text/css">
 	/* with SVG shape */
 	#article{
-		shape-inside: polygon(x1,y1 ...xn,yn);
+		shape-inside: url(#circle);
 		wrap-padding: 10px;
 		background-image: url(airplane.png);
-		background-position: center center;
-	    mask-box-image: url(circle.png) 100 stretch;
-		color:blue;
-	}
-	/* with image */
-	#article{
-		shape-image: url(circle.png);
-		shape-image-threshold: 100%;
-		wrap-padding: 10px;
-		background-image: url(airplane.png);
-		background-position: center center;
-	    mask-box-image: url(circle.png) 100 stretch;
 		color:blue;
 	}