W3C home > Mailing lists > Public > public-css-archive@w3.org > February 2017

[csswg-drafts] Context selectors' limitation

From: Man Hoang via GitHub <sysbot+gh@w3.org>
Date: Thu, 09 Feb 2017 02:52:26 +0000
To: public-css-archive@w3.org
Message-ID: <issues.opened-206389373-1486608744-sysbot+gh@w3.org>
jolleekin has just created a new issue for 
https://github.com/w3c/csswg-drafts:

== Context selectors' limitation ==
Suppose I have a custom element called `x-toggle`, which has two 
states `on` and `off` reflected by two CSS classes `on` and `off`, 
respectively.

First I want to style the element based its states. This is simple as 
follows
``` css
:host(.on) { ... }
:host(.off) { ... }
```

Next, I want to support RTL layout. The attribute `dir=rtl` can be 
specified on `x-foo` itself or one of its ancestors.
1. `dir=rtl` is on `x-foo`
``` css
:host([dir=rtl].on) { ... }
:host([dir=rtl].off) { ... }
```

2. `dir=rtl` is on an ancestor. Currently, there's no way I can create
 the following selectors within `x-foo`'s style tag. Will this problem
 be solved?
``` css
[dir=rtl] x-toggle.on { ... }
[dir=rtl] x-toggle.off { ... }
```
References:
- https://drafts.csswg.org/css-scoping/#host-selector

Please view or discuss this issue at 
https://github.com/w3c/csswg-drafts/issues/1013 using your GitHub 
account
Received on Thursday, 9 February 2017 02:53:02 UTC

This archive was generated by hypermail 2.4.0 : Tuesday, 19 October 2021 01:30:29 UTC