RE: How does the svg element handle CSS border and background-color?

> Between this, working with our own CSS experts, and working from first
> principles with the long-term future of SVG in mind, Iíve understood
> this to mean that when an element is embedded in HTML5 or XHTML,
> that outermost element does participate in the box model, and as such
> CSS formatting such as backgrounds, borders, margin, and padding should
> apply to that outermost SVG element, just like it would to a
> [X] ,
or any similar element.
> The list of CSS properties Jeff referenced are the ones that apply to
> the SVG content itself, but I would argue that when the outermost SVG
> element is embedded in HTML it must behave on equal footing with
> similar HTML elements. Going even further, when embedded in HTML the
> outermost SVG element should also support being directly styled a block
> or inline block, positioned as absolute, relative, or fixed, and so on.
> None of these styles are in that list, and none of these make sense for
> the SVG content itself, but they do make sense on the root SVG
> container element in HTML.

I must say that your conclusion seems entirely reasonable as well ... and from that explanation, I understand where you are coming from.
However, considering that this could be a rather important issue for future use of SVG on HTML pages... and the fact that each browser seems to be interpreting this area differently in one or several ways... I would like to continue pursuing this issue if everyone does not mind.
> IE9ís implementation has also been guided by interoperability
> principles when the specification is ambiguous. Attached is a simple
> example which renders (nearly) identically across Opera, Firefox,
> Chrome, Safari, and IE9 Platform Preview 4. This suggests that up until
> now the interpretation has always been that borders, backgrounds, and
> similar HTML CSS properties should apply. It would be a huge step
> backwards to start treating in HTML as some kind of special kind
> of element with reduced capability.

Yes, I noticed that many browsers were supporting stuff like border for the svg tag.  Technically, this creates a rather confusing situation with the SVG spec and the way the HTML5 spec defines how svg is embedded (I'll try and submit another email about that part).  So, that is what promted me to ask this qusetion about CSS border and background-color.

Received on Friday, 20 August 2010 00:19:13 UTC