User Agent: Mozilla/5.0 (X11; Linux x86_64; rv:11.0) Gecko/20100101 Firefox/11.0 Build ID: 20120316083740 Steps to reproduce: Open jsfiddle test case at http://jsfiddle.net/gentooboontoo/YaM7q/8/ Actual results: As of firefox 11 version (problem did not occur in Firefox 10), inline svg is clipped when its root element has no width or height attribute. In jsfiddle test case, the first SVG is clipped beacause SVG has no width or height attribute. The second one is correct because it has height and width attributes. Expected results: SVG should not be clipped and have the height of its parent if I understand correctly http://www.w3.org/TR/SVG/struct.html#SVGElementHeightAttribute Problem does not occur in chrome nor firefox 10
Rendering problem occurs with Windows and Linux.
Component: Untriaged → SVG
OS: Linux → All
Product: Firefox → Core
QA Contact: untriaged → general
Hardware: x86_64 → All
It seemed to be regressed by Bug 611099 and Bug 668163
This was an intentional change to address what was felt was unexpected behavior of inline SVG. See bug 668163 comment 26 and 27. Basically if the width and height attributes are not explicitly set, inline <svg> is treated as having a width and height of 'auto'.
Summary: inline svg rendering is clipped when root svg has no width or height attributes → Inline <svg> is given the CSS default height of 150px when the height is not explicitly specified
IE9CP, IE9, Chrome17.0.963.79m and Opera11.61 are as expected. Only Firefox11-14a1 is different in a result.
Authors frequently found the previous behavior confusing; the relevant specifications are clear that our new behavior is correct. See, in particular, http://www.w3.org/TR/2011/REC-SVG11-20110816/coords.html#IntrinsicSizing , which says: Note: the ‘width’ and ‘height’ attributes are not the same as the CSS width and height properties. Specifically, percentage values do not provide an intrinsic width or height, and do not indicate a percentage of the containing block. Rather, once the viewport is established, they indicate the portion of the viewport that is actually covered by image data. and the size computation rules in: http://www.w3.org/TR/CSS21/visudet.html#inline-replaced-width http://www.w3.org/TR/CSS21/visudet.html#inline-replaced-height I'm not sure if the spec has been revised to reflect what makes the second example work, though.
Status: NEW → RESOLVED
Last Resolved: 7 years ago
Resolution: --- → INVALID
This behavior need to be documented on MDN At least in those 2 pages : - https://developer.mozilla.org/en/SVG_In_HTML_Introduction - https://developer.mozilla.org/en/SVG/Element/svg
http://www.w3.org/TR/SVG/struct.html#SVGElementWidthAttribute "If the attribute is not specified, the effect is as if a value of '100%' were specified." That seems to be directly contradicted by the new behavior.
For the purpose of the attribute's meaning within SVG, it is -- the graphic occupies the complete viewport. But http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing is clear that percentage widths and heights "do not provide an intrinsic width or height, and do not indicate a percentage of the containing block".
You need to log in before you can comment on or make changes to this bug.