search

jensimmons / cssremedy

Start your project with a remedy for the technical debt of CSS.
Mozilla Public License 2.0
2.2k stars 113 forks source link

svg display attribute ignored #86

Open ristew opened 2 years ago

ristew commented 2 years ago

Minimum example:

<svg display="none" width="100" height="100">
  <circle cx="50" cy="50" r="50" />
</svg>

workaround:

svg[display="none"] {
  display: none;
}
nucliweb commented 2 years ago

Why not use the global attribute hidden?

SVG

<svg hidden width="100" height="100">
  <circle cx="50" cy="50" r="50" />
</svg>

CSS

svg[hidden] {
  display: none;
}
ristew commented 2 years ago

I made an issue with the library it's coming from: https://github.com/google/blockly/issues/5840. Even display: initial or display: unset triggered the behavior, so I feel it's best to avoid use of the SVG display attribute altogether as it can easily be the victim of undefined behavior.