This shows you the differences between two versions of the page.
Next revision | Previous revisionNext revisionBoth sides next revision | ||
ideas:css3-exclusions-use-cases [2011/10/28 10:09] – created vhardy | ideas:css3-exclusions-use-cases [2011/10/28 10:58] – [CSS Exclusions and Shapes] rossen | ||
---|---|---|---|
Line 80: | Line 80: | ||
wrap-flow: | wrap-flow: | ||
wrap-margin: | wrap-margin: | ||
- | wrap-shape: circle(50%, 50%, 30%); | + | shape-outside: circle(50%, 50%, 30%); |
} | } | ||
Line 91: | Line 91: | ||
wrap-flow: | wrap-flow: | ||
- | wrap-shape: rect(10%, 50%, 200px 200px); | + | shape-outside: rect(10%, 50%, 200px 200px); |
} | } | ||
Line 422: | Line 422: | ||
< | < | ||
< | < | ||
+ | <circle id=" | ||
<style type=" | <style type=" | ||
/* with SVG shape */ | /* with SVG shape */ | ||
#article{ | #article{ | ||
- | shape-inside: | + | shape-inside: |
wrap-padding: | wrap-padding: | ||
- | |||
- | background-image: | ||
- | background-position: | ||
- | mask-box-image: | ||
- | color: | ||
- | } | ||
- | |||
- | /* with image */ | ||
- | #article{ | ||
- | shape-image: | ||
- | shape-image-threshold: | ||
- | wrap-padding: | ||
- | |||
background-image: | background-image: | ||
- | background-position: | ||
- | mask-box-image: | ||
color: | color: | ||
} | } |