W3C home > Mailing lists > Public > www-style@w3.org > May 2012

Re: <style scoped> and the cascade

From: Daniel Brockman <daniel@gointeractive.se>
Date: Fri, 27 Apr 2012 10:32:22 +0000
To: public-html@w3.org
Cc: "Tab Atkins Jr." <jackalmage@gmail.com>, Ian Hickson <ian@hixie.ch>, www-style@w3.org, Boris Zbarsky <bzbarsky@MIT.EDU>, Dimitri Glazkov <dglazkov@chromium.org>
Message-ID: <9197CDB4DB934579BA82341F1021F934@gmail.com>
I found this thread after searching for "<style scoped>",  
because I am playing with it in Google Chrome and the
results I was getting seemed to be surprising, and wrong.

So it turns out I got bit by this too.  It seems very unintuitive
for a simple scoped selector to be overridden by a simple
global selector for the same element.  Made me think I
either wasn't understanding the purpose of <style scoped>,
or there must be a bug in Chrome.

To make matters worse, I also don't see any easy way of
increasing the specificity of the local rule short of introducing
some kind of wrapper class/ID (or liberal use of "!important").

And this is for the simplest use case you can think of:

<link href="normalize.css" rel="stylesheet">
…
<section>
  <style scoped>
    h1 { margin-top: 0 } /* doesn't work */
  </style>
  <h1>foo</h1>
</section>

So consider this another up vote for the proposed solution,
which sounds logical to me, and is in fact how I expected it
to work in the first place.

--
Daniel Brockman, partner & developer
Go Interactive <http://gointeractive.se>
Twitter: http://twitter.com/dbrock
Telephone: +46706880739
Received on Thursday, 31 May 2012 19:44:21 GMT

This archive was generated by hypermail 2.3.1 : Tuesday, 26 March 2013 17:20:54 GMT