Skip to content

Commit ba2ee71

Browse files
committed
Added an idea for duplicating elements.
1 parent a70699f commit ba2ee71

1 file changed

Lines changed: 30 additions & 1 deletion

File tree

css3-layout/Overview.src.html

Lines changed: 30 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2038,6 +2038,34 @@ <h3 id=flow>Flowing content into slots: 'flow'</h3>
20382038
is ''max-content' and an element in the slot has 'height: 110%', there
20392039
is a conflict&hellip;
20402040

2041+
<div class=issue>
2042+
<p>Allowing multiple values on 'flow' could be an easy way to
2043+
duplicate elements. E.g., this style
2044+
2045+
<pre>
2046+
BODY {grid: "a.b.c."}
2047+
H1 {flow: a, b, c}
2048+
#art1 {flow: a}
2049+
#art2 {flow: b}
2050+
#art3 {flow: c}
2051+
</pre>
2052+
2053+
<p>with a document like
2054+
2055+
<pre>
2056+
...
2057+
&lt;H1>Local news&lt;/H1>
2058+
&lt;DIV ID=art1>...&lt;/DIV>
2059+
&lt;DIV ID=art2>...&lt;/DIV>
2060+
&lt;DIV ID=art3>...&lt;/DIV>
2061+
</pre>
2062+
2063+
<p>would repeat the H1 at the top of all three
2064+
columns. With <a href="#region-based" >region-based styling,</a> the
2065+
three instances could even be styled differently, e.g., with generated
2066+
content: 'H1::flow(b)::before {content: "cont'd "}'
2067+
</div>
2068+
20412069
<!--=================================================================-->
20422070

20432071
<h3>Absolute positioning using a grid: 'grid-position-x' and
@@ -3647,7 +3675,8 @@ <h4>Style the slots (pseudo-elements)</h4>
36473675

36483676
<!--=================================================================-->
36493677

3650-
<h4>Style the contents of slots (region-based styling)</h4>
3678+
<h4 id=region-based>Style the contents of slots (region-based
3679+
styling)</h4>
36513680

36523681
<p>By means of a new pseudo-element, style could be applied to only
36533682
the part of an element that is inside a certain slot (similar to how

0 commit comments

Comments
 (0)