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

I was going to submit a possible clarification for how embedding SVG in HTML should work (based on the specs and clarifying some vague areas).
However, I am confused and concerned about one issue:  what if you set a border, background-color, or some other CSS property that adds something visual to the svg tag?
Assume an html document like the following
Assume we, specify (in CSS) that the svg tag has a background-color, border, or some other CSS property that adds something visual.
According to my understanding of the SVG specs, the svg tag is non-graphical and should not render anything onscreen.  It can affect the flow of the html document, but does not show up visually (like a div with visibility=none).  This also means events cannot "dispatch" from said invisible svg element.
Anyways, it all makes sense, until you add things like background-color, border, or some other graphical property.  The svg element suddenly turns into a weird hybrid graphical element (when it is supposed to be non-graphical).  This unusual situations raises questions like: Should the svg element now be allowed to "dispatch" events, despite what the SVG spec says?  Should the svg element now block access to items underneath (act like an invisible or visible layer)?
Is there anywhere in the specs that addresses this issue?
...Or is this a very special case that only applies to embedding the svg tag in an html5 document... meaning maybe this needs to be addressed from the perspective of the HTML5 spec?

Received on Wednesday, 18 August 2010 17:54:28 UTC