Re: [whatwg] hidden attribute useless with display: flex?

On Thu, 1 May 2014, David Bruant wrote:
> Le 30/04/2014 23:32, Ian Hickson a écrit :
> > > > What I'm trying to do is just that an element have display:flex 
> > > > and to hide it with the hidden attribute when I don't need the 
> > > > element to be shown. I guess my only option is changing 
> > > > style.display?
> >
> > Just add "[hidden] { display: none }" to your style sheet.
>
> Hmm... interesting. And that works because my stylesheet is the author 
> stylesheet which takes precedence over the UA stylesheet.
> 
> Is there a scenario where CSS specificity leads to this rule being 
> ignored?

Yeah, as usual specificity can rock the boat. :-)

   div.ui { display: flex; }

...would override it (since 0,0,1,1 > 0,0,1,0). But if that's an issue, 
you can move this to the !important level:

   [hidden] { display: none ! important; }


> If the answer is no, I'm sold. It's not any worse than *{box-sizing: 
> border-box} which I do all the time.

Yeah, it's exactly like that. Or * { font: inherit; }, which I do all the 
time, but which you then have to "fix" for headings and <strong> and so on.

-- 
Ian Hickson               U+1047E                )\._.,--....,'``.    fL
http://ln.hixie.ch/       U+263A                /,   _.. \   _\  ;`._ ,.
Things that are impossible just take longer.   `._.-(,_..'--(,_..'`-.;.'