Differences

This shows you the differences between two versions of the page.

--- spec:css3-regions:regions-styling [2012/03/16 10:13] – vhardy
+++ spec:css3-regions:regions-styling [2014/12/09 15:48] (current) – external edit 127.0.0.1
@@ Line 1: / Line 1: @@
 ==== Region Styling: Proposed alternate syntax ====
+PAGE OBSOLETE: in light of the discussion on www-style (see http://lists.w3.org/Archives/Public/www-style/2012Mar/0490.html), there seem to be a
+preference for sticking to the @region syntax. The getComputedStyle API can be provided differently, for example as a method on the
+Region interface (e.g., Region.getComputedStyle(elem)).
 == Problem Description ==
@@ Line 75: / Line 79: @@
 === Open questions ===
+  * Limitation: styling pseudo elements
-  * Can we chain pseudo-elements? For example, can we do the following:
-<code>
-window.getComputedStyle(elem, "::before::in-region(regionA)");
-</code>
 According to the [[http://dev.w3.org/csswg/selectors3/#w3cselgrammar|Selectors Level 3]] specification:
 <file>
-Note that pseudo-elements are restricted to one per selector and occur only in the last simple_selector_sequence.
+... pseudo-elements are restricted to one per selector and occur only in the last simple_selector_sequence.
 </file>
-which seems to prevent the combination of a '::before' pseudo-element selector with another '::in-region()' pseudo selector.
+which prevents the combination of a '::before' pseudo-element selector with another '::in-region()' pseudo selector.
+In a situation like:
+<code>
+#myElement {
+    flow-into: article;
+}
+#myElement::before {
+    content: "The quick brown fox";
+}
+</code>
+There is no way to select the fragment of #myElement::before that falls into, say, regionA. That selector would be:
+<code>
+#myElement::before::in-region(regionA);
+</code>
+but that would require combining pseudo-elements, which is not possible currently with Selector 3.
+Proposal: accept the limitation of Selector 3. If that gets lifted in Selector 4, authors will get more flexibility.
+  * Limitation: nested regions.
+Consider the following use case:
+<code>
+<div id="postit-A"></div>
+<div id="postit-B"></div>
+<div id="regionA"></div>
+<div id="regionB"></div>
+<div id="regionC"></div>
+<div id="regionD"></div>
+#postit-A, #postit-B {
+	flow-from: block-flow;
+}
+#regionA, #regionB, #regionC, #regionD {
+	flow-into: block-flow;
+	flow-from: article;
+}
+</code>
+What if we want to have special styling for a '.title' that falls into regionB if regionB is in postit-A but not in postit-B?
+.title::in-region(regionB) selects the fragment of .title that falls into regionB. There is no way to say "… that falls
+into the fragment of regionB that falls into postit-A.
+Proposed resolution: accept this limitation.