Display contents svg (#2599) · w3c/csswg-drafts@2cdf747 (original) (raw)

`@@ -35,6 +35,14 @@ spec:css-pseudo-4; type:selector;

`

35

35

` text: ::first-line

`

36

36

` text: ::before

`

37

37

` text: ::after

`

``

38

`+

spec: svg2;

`

``

39

`+

type:dfn;

`

``

40

`+

text: container element

`

``

41

`+

text: text content child element

`

``

42

`+

text: renderable element

`

``

43

`+

text: non-rendered element

`

``

44

`+

text: rendered element

`

``

45

`+

text: presentation attribute

`

38

46

`

`

39

47

``

40

48

`

`

`@@ -1160,34 +1168,71 @@ HTML Elements {#unbox-html}

`

1160

1168

`SVG Elements {#unbox-svg}

`

1161

1169

`---------------------------

`

1162

1170

``

1163

``

`-

: Root <{svg}>

`

``

1171

`+

: An <{svg}> element that has CSS box layout

`

``

1172

`+

(this includes all <{svg}> whose parent is an HTML element,

`

``

1173

`+

as well as document root elements)

`

1164

1174

` ::

`

1165

1175

`''display: contents'' behaves as ''display: none''.

`

1166

1176

``

1167

``

`-

: Nested <{svg}>

`

1168

``

`-

: <{a}>

`

1169

``

`-

: <{g}>

`

1170

``

`-

: <{use}> (treated as a Shadow DOM container)

`

1171

``

`-

: <{tspan}>

`

1172

``

`-

: <{textPath}>

`

1173

``

`-

: unknown elements

`

``

1177

`+

: All other SVG [=container elements=] that are also [=renderable elements=]

`

``

1178

`+

: SVG [=text content child elements=]

`

``

1179

`+

: <{use}>

`

1174

1180

` ::

`

1175

1181

`''display: contents'' strips the element from the formatting tree,

`

1176

1182

` and hoists its contents up to display in its place.

`

``

1183

`+

These contents include the shadow-DOM content for <{use}>.

`

1177

1184

``

1178

1185

` : any other SVG elements

`

1179

1186

` ::

`

1180

1187

`''display: contents'' behaves as ''display: none''.

`

``

1188

+

``

1189

`+

When an element is stripped from the formatting tree,

`

``

1190

`+

then any SVG attributes on that element

`

``

1191

`+

that control the layout and formatting of its child content

`

``

1192

`+

(or shadow DOM content)

`

``

1193

`+

are ignored when rendering the contents.

`

``

1194

`+

However, SVG [=presentation attributes=]

`

``

1195

`+

continue to affect CSS property inheritance,

`

``

1196

`+

the same as CSS styles set in any other way.

`

``

1197

+

``

1198

`+

Issue(w3c/csswg-drafts#2502):

`

``

1199

`+

Is this description clear enough to identify

`

``

1200

`+

the SVG attributes affected by ''display: contents''?

`

``

1201

+

``

1202

+

``

1203

`+

`

``

1204

+

``

1205

`+

The intention here is that

`

``

1206

`+

the ''display: none'' behavior applies

`

``

1207

`+

whenever the "rendering context" inside the element

`

``

1208

`+

is different than the context outside of it.

`

``

1209

`+

If the element's child elements would not be valid children

`

``

1210

`+

of the element's parent,

`

``

1211

`+

you cannot simply hoist them up the formatting tree.

`

``

1212

+

``

1213

`+

For example, text content and text formatting elements in SVG

`

``

1214

`+

require a <{text}> element context;

`

``

1215

`+

if you remove a <{text}>,

`

``

1216

`+

its child text content and elements are no longer valid.

`

``

1217

`+

For that reason, ''display: contents'' on <{text}>

`

``

1218

`+

prevents the entire text element from being rendered.

`

``

1219

`+

In contrast, any content inside a <{tspan}> or <{textPath}>

`

``

1220

`+

is also valid content inside the parent text formatting context,

`

``

1221

`+

so the hoisting behavior applies for these elements.

`

``

1222

+

``

1223

`+

Similarly, if hoisting would convert the children from

`

``

1224

`+

[=non-rendered elements=]

`

``

1225

`+

(e.g., a shape inside a <{pattern}> or <{symbol}>)

`

``

1226

`+

to [=rendered elements=]

`

``

1227

`+

(e.g., a shape that is a direct child of the <{svg}>),

`

``

1228

`+

that is an invalid change of rendering context.

`

``

1229

`+

Never-rendered container elements therefore cannot be "un-boxed"

`

``

1230

`+

by ''display: contents''.

`

``

1231

`+

(Also, authors cannot override the 'display' property on these elements:

`

``

1232

`+

it is forced to ''none'' by an ''!important'' user agent style rule.)

`

``

1233

+

``

1234

`+

`

1181

1235

``

1182

``

`-

Note: The intention here is that "nested container" elements--

`

1183

``

`-

elements which have the same sort of "rendering context"

`

1184

``

`-

both outside and inside themselves,

`

1185

``

`-

such that it's meaningful to put their contents

`

1186

``

`-

into the context of their parents--

`

1187

``

`-

get stripped and hoist their contents like normal for ''display: contents''.

`

1188

``

`-

Anything else,

`

1189

``

`-

where their contents are handled in a totally separate context from their parent,

`

1190

``

`-

just removes itself entirely.

`

1191

1236

``

1192

1237

`MathML Elements {#unbox-mathml}

`

1193

1238

`-------------------------------

`