[css3-box] Added some more issues related to things Anton and I are

haven't finished the text for.

Author: bert-github

css3-box/Overview.src.html

@@ -105,7 +105,12 @@ <h2 class="no-toc no-num">Status of this document</h2>
 implementations. See the section <a href="#exit">“CR exit criteria”
 </a> for details.
 
-<p class=mtb>This module should eventually replace corresponding parts
+<p class=mtb>The terminology and the order of the sections is
+currently in flux. This working draft is published to show the
+features that are being discussed in the context of this module, but
+it is likely that some of the names of the features will change.
+
+<p>This module should eventually replace corresponding parts
 of the revised CSS level 2 specification [[!CSS21]]. But this is an
 early draft and any differences to level 2 are most likely
 unintentional, unless they concern new features, such as vertical text
@@ -228,6 +233,7 @@ <h2>Introduction &amp; definitions</h2>
 <p>[Define the box tree before pagination and then describe how
 pagination can break one box into two?]
 
+<!--
 <ul>
 <li>If the parent element is a list item, the boxes go into the
 parent's block box, not the marker box.
@@ -244,6 +250,7 @@ <h2>Introduction &amp; definitions</h2>
 
 <li>Note that 'flow' puts boxes into a named flow root.
 </ul>
+-->
 </div>
 
 <p>When the specification says a box <var>A</var> <dfn>contains</dfn>
@@ -264,7 +271,8 @@ <h2>Introduction &amp; definitions</h2>
 inline).
 
 <div class=figure>
-  <p><img src="box-intro.png" alt="Schematic representation of rel">
+  <p><img src="box-intro.png" alt="Each generated box in the rendering
+  has a link to the element that generated it.">
 
   <p class="caption">Relation between four displayed boxes in the
   rendered document (on the right) and the three corresponding
@@ -325,12 +333,12 @@ <h2>Introduction &amp; definitions</h2>
 anonymous boxes: inheritable properties on anonymous boxes have the
 same value as the element, while non-inheritable properties have the
 initial value. The only property that boxes do not have is the
-'display' property. <span class=issue>[Actually, boxes are just
-rectangles with a border, a background, a position, a bunch of other
-boxes inside, and a reference to the element they belong to. They
-don't really have properties. But it is convenient to say the “the box
-has a font <var>X</var>” rather than the verbose “the element that
-generated the box has a font <var>X</var>.”</span>
+'display' property. <span class=issue>[Is this useful? Or is it better
+to say that boxes are just rectangles with a border, a background, a
+position, a bunch of other boxes inside, and a reference to the
+element they belong to? They don't really have properties then and it
+is only a convenience to say the “the box has a font
+<var>X.</var>”</span>
 
 <p>Boxes do not have specified values [[!CSS3CASCADE]], but they do
 have computed, used and actual values.
@@ -445,6 +453,11 @@ <h2>Introduction &amp; definitions</h2>
 for the edges of the children of a box and two terms (block dimension
 and inline dimension) for the width and height of a box.
 
+<p class=issue>The names head and foot are under discussion. There is
+an issue in [[!CSS3-WRITING-MODES]] that suggests some possible names:
+“head,” “before,” “before-block,” “foot,” “tail,” “after” and
+“after-block.”
+
 <p>The <dfn>head,</dfn> <dfn>foot,</dfn> <dfn>start</dfn> and
 <dfn>end</dfn> edge of a box refer to the top, right, bottom and left
 edges, depending on the 'writing-mode' and 'direction' properties of
@@ -587,7 +600,7 @@ <h2>The viewport and the canvas</h2>
 
 
 
-<h2>Flows</h2>
+<h2 id=flows>Flows</h2>
 
 <p>The <dfn>flow</dfn> (sometimes called <dfn>normal flow</dfn>) is
 one of the two basic kinds of layout in CSS, together with line layout
@@ -604,6 +617,8 @@ <h2>Flows</h2>
 href="#construct-flow">rules below.</a> We say the flow is
 <dfn>channeled</dfn> by the flow root.
 
+<p class=issue>Are there more intuitive names than flow root?
+
 <p>The <dfn title="initial flow|flow!!initial" >initial flow</dfn> is
 the flow that contains the root of the box tree.
 
@@ -849,6 +864,7 @@ <h2>Flows</h2>
 -->
 
 
+
 <h2>Types of boxes</h2>
 
 <p>The layout of boxes in the flow is in large part determined by the
@@ -959,60 +975,6 @@ <h3 id=display>The display property</h3>
 an element to generate boxes that affect formatting but are not
 visible themselves.
 
-<p class=note>Note that both 'clear-after' and ''container'' can be
-used to force the next element after this one to start after any
-floats inside this element, but the effect is not exactly the same.
-E.g., 'display: container' also affects certain forms of margin
-collapsing.
-
-<p class=note>Note that 'vertical-align' applies to ''container''
-elements. The 'vertical-align' property doesn't apply
-to other block-level elements, except ''table-cell'' elements.
-
-<p class=issue>Any sense in vertically spreading out the contents,
-something like 'vertical-align: justify'?
-
-<p class=issue>Simpler to not use 'vertical-align', but creating
-''top-box'', ''middle-box'' and ''bottom-box''?
-
-<div class=example>
-<p>The 'vertical-align' property applies to ''container''
-elements <span class=issue>[check in [[!CSS3TEXT]]!]</span>, and can
-thus be used to create vertically centered content, without wrapping
-the content in a table (which may not be always possible, and also
-causes the 'width' property to behave differently).
-
-<pre>
-div.slide {
-  display: container;
-  height: 15em;
-  vertical-align: middle;
-  border: thin solid }
-</pre>
-
-<p>with a document fragment like this:
-
-<pre>
-&lt;div class=slide>
-  &lt;ul>
-    &lt;li>Bullet lists are boring
-    &lt;li>They distract from the speaker
-    &lt;li>Don't use them!
-  &lt;/ul>
-&lt;/div>
-</pre>
-
-<p>might look like this figure:
-
-<div class=figure>
-  <p><img src="align-box.png" alt="A 15 em high box with three bullet
-  items in the center">
-
-  <p class=caption>The 'vertical-align: middle' causes the content of
-  the ''container'' to be vertically centered.
-</div>
-</div>
-
 <p>The computed value of 'display' depends on 'position' [[CSS3POS]],
 'float' and 'overflow':
 
@@ -1045,34 +1007,13 @@ <h3 id=display>The display property</h3>
 
 
 
-<h3>Mixing the box model with other formatting models</h3>
-
-<p>There may be documents that combine different layout models, such
-as documents that combine HTML (typically rendered with the CSS box
-model) and <span class=index>SVG</span> (rendered with its own
-graphics model). If an element that is rendered according to the CSS
-box model has a child that is to be rendered with a different model,
-that child needs to have a 'display' property with a value that
-indicates that the child is not in the box model.
-
-<p>Such a child is treated as a <em>replaced element</em> for the
-purposes of determining its size, position, margins, padding and
-border.
-
-<p class=issue>Should we allow a more complex model, where such a
-child may negotiate with the CSS environment to have several boxes and
-several baselines, so that it can take part in line breaking and page
-breaking?
-
-<p>This specification defines no value(s) for the 'display' property
-that indicate that an element is formatted according to a different
-model than the box model, but separate specifications may do so.
-
-
-
 <h3>Block-level boxes, containing blocks, flows and anonymous
 boxes</h3>
 
+<p class=issue>Split this section. Put the definition of containing
+block in its own section and move it to right after the <a
+href="#flows" >Flows</a> section above.
+
 <p>A <dfn>block-level</dfn> box is a box that has a <span>computed
 value</span> for 'display' of ''block'', ''container'', ''list-item'',
 ''table'', ''table-*'' (i.e., all table boxes, see [[CSS3TBL]]),
@@ -1159,6 +1100,11 @@ <h3>Block-level boxes, containing blocks, flows and anonymous
 	    </ol>
 </ul>
 
+
+<p class=issue>Other modules may introduce other types of boxes with
+other rules for how to find their containing block. E.g., the
+containing block of an absolutely positioned element.
+
 <p>In the above, a <dfn>block container box</dfn> is, informally, a
 box that can contain block boxes. More precisely: any box generated by
 a (pseudo-)element with a computed value for 'display' of ''block'',
@@ -1441,6 +1387,91 @@ <h3 id=compact-boxes>Compact boxes</h3>
 </div>
 
 
+<h3>Container box <span class=issue>or: Align-box</span></h3>
+
+<p class=issue>[C.f. the discussion of how to force an element to
+contain floats.]
+
+<p class=note>Note that both 'clear-after' and ''container'' can be
+used to force the next element after this one to start after any
+floats inside this element, but the effect is not exactly the same.
+E.g., 'display: container' also affects certain forms of margin
+collapsing.
+
+<p class=note>Note that 'vertical-align' applies to ''container''
+elements. The 'vertical-align' property doesn't apply
+to other block-level elements, except ''table-cell'' elements.
+
+<p class=issue>Any sense in vertically spreading out the contents,
+something like 'vertical-align: justify'?
+
+<p class=issue>Simpler to not use 'vertical-align', but creating
+''top-box'', ''middle-box'' and ''bottom-box''?
+
+<div class=example>
+<p>The 'vertical-align' property applies to ''container''
+elements <span class=issue>[check in [[!CSS3TEXT]]!]</span>, and can
+thus be used to create vertically centered content, without wrapping
+the content in a table (which may not be always possible, and also
+causes the 'width' property to behave differently).
+
+<pre>
+div.slide {
+  display: container;
+  height: 15em;
+  vertical-align: middle;
+  border: thin solid }
+</pre>
+
+<p>with a document fragment like this:
+
+<pre>
+&lt;div class=slide>
+  &lt;ul>
+    &lt;li>Bullet lists are boring
+    &lt;li>They distract from the speaker
+    &lt;li>Don't use them!
+  &lt;/ul>
+&lt;/div>
+</pre>
+
+<p>might look like this figure:
+
+<div class=figure>
+  <p><img src="align-box.png" alt="A 15 em high box with three bullet
+  items in the center">
+
+  <p class=caption>The 'vertical-align: middle' causes the content of
+  the ''container'' to be vertically centered.
+</div>
+</div>
+
+
+<h3>Mixing the box model with other formatting models</h3>
+
+<p>There may be documents that combine different layout models, such
+as documents that combine HTML (typically rendered with the CSS box
+model) and <span class=index>SVG</span> (rendered with its own
+graphics model). If an element that is rendered according to the CSS
+box model has a child that is to be rendered with a different model,
+that child needs to have a 'display' property with a value that
+indicates that the child is not in the box model.
+
+<p>Such a child is treated as a <em>replaced element</em> for the
+purposes of determining its size, position, margins, padding and
+border.
+
+<p class=issue>Should we allow a more complex model, where such a
+child may negotiate with the CSS environment to have several boxes and
+several baselines, so that it can take part in line breaking and page
+breaking?
+
+<p>This specification defines no value(s) for the 'display' property
+that indicate that an element is formatted according to a different
+model than the box model, but separate specifications may do so.
+
+
+
 
 <h2>The padding properties</h2>
 
@@ -1525,7 +1556,7 @@ <h2>The padding properties</h2>
 
 
 
-<h2>The margin properties</h3>
+<h2>The margin properties</h2>
 
 <p>Margins in CSS serve to add both horizontal and vertical space
 between boxes.
@@ -2013,6 +2044,8 @@ <h2 id=intrinsic>Definition of min-content/max-content</h2>
 <p class=note>OVERFLOW is not necessarily monotonic in <var>w</var>
 and a binary search for min-content and max-content may thus fail.
 
+<p class=issue>Say something about acceptable near-optimal results?
+
 <p class=note>Note that the ''min-content'' width of a block may be
 larger than the ''min-content'' of all its children, because it may be
 impossible to break a line between two children.
@@ -2449,6 +2482,12 @@ <h3 id=collapsing-margins>Collapsing margins</h3>
 
 
 
+<h2>Inline-level formatting</h2>
+
+<p>In an inline formatting context, inline-level boxes are laid out in
+the manner of a run of words and sentences. Inline-level formatting,
+and the behavior of inline-level boxes, is specified in the text
+specification [[!CSS3TEXT]].