Re: [svgwg] SVG and CSS display:contents

This is a good question, but I think the easiest solution is to follow
 both specs as written.

Hypothetically, if `display: contents` _were_ to apply for SVG, the 
logical implementation would be:

- If `display: contents` is on the `<svg>` element that is the start 
of the SVG subtree (i.e., a root element or a direct child of an HTML 
element), don't switch to SVG rendering mode, don't create an SVG 
canvas, treat all the child nodes as if they were plain CSS-styled-XML
 nodes.  If there are nested `<svg>` elements, they each start their 
own inline SVG canvases.

- If `display: contents` is on a nested `<svg>` or a `<g>`, ignore any
 transformations applied on that element, including the implicit 
transformations created by `viewBox` and `x`,`y`,`width`, and `height`
 and the effect they have on percentage units and the user-space 
coordinate system for child elements.  Based on the way `<use>` 
behaves in the rendering tree for the Shadow DOM model, it should 
follow this behavior, with the shadow DOM elements being rendered but 
without any `x`/`y`/`transform` adjustments from the `<use>`.

- If `display: contents` is on an SVG shape, the child elements would 
be rendered as if they were children of the parent.  Assuming the SVG 
DOM tree is valid, the effect would be that nothing is rendered: any 
valid child elements of a shape are not rendered when added directly 
to an SVG canvas.

- Setting `display: contents` on a never-rendered SVG element type 
(such as `defs` or `pattern`) should not have any effect, consistent 
with the fact that the display mode can never be changed on those 
elements. (In SVG 2, we define this using an [`!important` user agent 
stylesheet 
rule](https://www.w3.org/TR/SVG2/styling.html#UAStyleSheet); 
previously, it was defined in prose.)

All of this is very complicated, and of questionable utility.   The 
only use case that I could see is being able to turn off SVG rendering
 mode on an `<svg>` to render its plain text content (including alt 
text) as CSS-styled text.  However, if that is a desired behavior, it 
would probably be better to have a more explicit switch.

**I am therefore inclined to follow the SVG spec as written (and the 
Gecko implementation), and say that `display: contents` should not 
apply to SVG elements that do not have any CSS layout boxes anyway. **
 

For `<svg>` elements that are direct children of HTML elements (and 
_do_ have regular CSS layout boxes for positioning the SVG canvas, and
 are affected by other `display` values), the guidance from the 
[Display 3 spec](https://drafts.csswg.org/css-display/#box-generation)
 applies:

> This value has no effect on replaced elements and form controls; it 
computes to inline exactly as if the UA style sheet had specified 
display: inline !important on such elements.

An SVG canvas is a "replaced element" for the purpose of the CSS box 
tree, so `display: contents` should be treated as `display: inline`.  
(I'm not sure why the `!important` bit is mentioned; I'm assuming this
 is a "used value" fix that only applies *after* all the cascade is 
calculated.  But that's an issue to bring up with CSS WG.)

-- 
GitHub Notification of comment by AmeliaBR
Please view or discuss this issue at 
https://github.com/w3c/svgwg/issues/305#issuecomment-279505616 using 
your GitHub account

Received on Monday, 13 February 2017 20:02:07 UTC