Changes

This page is an in-progress attempt of [[User:Jonathan_Watt|mine]] to make sense of the sizing of SVG content. You 'd think it would think that be simple, what with one 'width' attribute and one 'height' attribute this is a simple issue. Unfortunately the interaction , there are a lot of multiple unitsother things to consider too, such as different unit types, omitted attribute(s), the CSS 'width/', 'height/', 'min-width/', 'min-height', 'max-width/min-height/', 'max-height properties, the ' and 'background-image' propertyproperties, the 'viewBox ' attribute, intrinsic width/, height, intrinsic and aspect ratio, and whether the SVG is rendering standalone, embedded inline, or embedded by reference all . All add to the fun.

The affect of the CSS width/height/etc. properties are is fairly well defined. An important question to answer is , what part do the SVG 'width ', 'height' and height 'viewBox' attributes play, and how do they interact with the CSSproperties? Currently there are two primary candidate approaches to sizing SVG content; (1) map the 'width' and 'height' attributes into style; (2) treat root 'svg' elements as "replaced elements" in CSS terms. The former approach would have the advantage of being the most intuitive for authors. The latter approach solves the problem of the 'display' property (i.e. [http://lists.w3.org/Archives/Public/www-svg/2005May/0022.html what you do with |display:inline;| on SVG]), and unless the user sets only one of the CSS properties 'width' and 'height' on the SVG while also having 'width' and 'height' attributes, they won't notice a difference to the former approach (well, as long as percentage attribute values are intrinsic).