On Sun, 19 Dec 2010 10:17:18 +0100, t...@ymail.com <t...@ymail.com> wrote:
> Here's what the specs say: > > http://www.w3.org/TR/SVG/masking.html#AutoClipAtViewportNotViewBox > > but what does it mean? At least this works in Opera: > > <?xml version="1.0" encoding="UTF-8" ?> > <svg xmlns="http://www.w3.org/2000/svg"; > xmlns:xlink="http://www.w3.org/1999/xlink"; > version="1.1" > clip="rect(0,300,300,0)" >> > <title>overflow test</title> > <rect width="300" height="300" /> > <line stroke-width="10" x2="300" y2="300" stroke="red" /> > </svg> > > But that's probably not what you want, and it doesn't work in Firefox, > Batik, Chrome, Inkscape or with librsvg. The 'clip' property changed meaning from CSS2 to CSS2.1, that's one reason, another is that it wasn't implemented the way SVG 1.1 specified it for <image> and nested <svg> elements in some browsers (and not at all in others). The plan ahead is to align with CSS2.1, and I would recommend that you use 'clip-path' instead for the time being since that has better cross-browser support. The overflow property clips the child content to the established viewport, see this example[1]. Note however that viewBox isn't the same as viewport, if the aspect ratio is different you might see some "overflow" (since the viewBox is positioned in the viewport using preserveAspectRatio, which defaults to "xMidYMid meet", essentially center the content inside the viewport). The rule-of-thumb is that the viewport for an <svg> element is defined by the width and height attributes, and the viewBox naturally by the viewBox attribute. Anyway, this is what you want I guess: <?xml version="1.0" encoding="UTF-8" ?> <svg xmlns="http://www.w3.org/2000/svg"; xmlns:xlink="http://www.w3.org/1999/xlink"; version="1.1" viewBox="0 0 10 10" overflow="hidden" clip-path="url(#clip)" > <title>overflow test</title> <defs> <clipPath id="clip"> <rect width="100%" height="100%"/> </clipPath> </defs> <rect width="100%" height="100%" /> <line x2="100%" y2="100%" stroke="red" /> </svg> Cheers /Erik [1] http://dev.w3.org/SVG/profiles/1.1F2/test/svg/masking-path-03-b.svg -- Erik Dahlstrom, Core Technology Developer, Opera Software Co-Chair, W3C SVG Working Group Personal blog: http://my.opera.com/macdev_ed ------------------------------------ ----- To unsubscribe send a message to: svg-developers-unsubscr...@yahoogroups.com -or- visit http://groups.yahoo.com/group/svg-developers and click "edit my membership" ----Yahoo! Groups Links <*> To visit your group on the web, go to: http://groups.yahoo.com/group/svg-developers/ <*> Your email settings: Individual Email | Traditional <*> To change settings online go to: http://groups.yahoo.com/group/svg-developers/join (Yahoo! ID required) <*> To change settings via email: svg-developers-dig...@yahoogroups.com svg-developers-fullfeatu...@yahoogroups.com <*> To unsubscribe from this group, send an email to: svg-developers-unsubscr...@yahoogroups.com <*> Your use of Yahoo! Groups is subject to: http://docs.yahoo.com/info/terms/
