Skip to content

Commit 1d78190

Browse files
committed
*** empty log message ***
1 parent 1da5b39 commit 1d78190

File tree

3 files changed

+151
-126
lines changed

3 files changed

+151
-126
lines changed

css-line-grid/Overview.html

+90-76
Original file line numberDiff line numberDiff line change
@@ -175,19 +175,19 @@ <h2 class="no-num no-toc" id=contents>Table of contents</h2>
175175
class=secno>3.4. </span>Forcing Line Width to Multiple of
176176
<em>em</em></a>
177177
<ul class=toc>
178-
<li><a href="#round-length"><span class=secno>3.4.1. </span>Rounding
178+
<li><a href="#character-grid-the-layout-grid-char-prop"><span
179+
class=secno>3.4.1. </span>Character Grid: the &lsquo;<code
180+
class=property>layout-grid-char</code>&rsquo; property</a>
181+
182+
<li><a href="#round-length"><span class=secno>3.4.2. </span>Rounding
179183
Lengths to Multiple of Units: &lsquo;<code
180184
class=css>rounddown()</code>&rsquo; and &lsquo;<code
181185
class=css>roundup()</code>&rsquo; </a>
182186

183187
<li><a href="#rounding-lengths-to-multiple-of-units-th"><span
184-
class=secno>3.4.2. </span>Rounding Lengths to Multiple of Units: the
188+
class=secno>3.4.3. </span>Rounding Lengths to Multiple of Units: the
185189
&lsquo;<code class=property>layout-grid-measure</code>&rsquo;
186190
property</a>
187-
188-
<li><a href="#character-grid-the-layout-grid-char-prop"><span
189-
class=secno>3.4.3. </span>Character Grid: the &lsquo;<code
190-
class=property>layout-grid-char</code>&rsquo; property</a>
191191
</ul>
192192
</ul>
193193

@@ -283,8 +283,8 @@ <h3 id=context><span class=secno>1.1. </span>Background</h3>
283283
</div>
284284

285285
<div class=sidefigure id=ex-width> <img alt="East Asian layouts may require
286-
width be a multiple of em without fractions" height=168
287-
src=width-multiple-of-em.png width=206>
286+
width be a multiple of em without fractions" height=142
287+
src=width-multiple-of-em.png width=180>
288288
<p class=caption>East Asian layouts may require width be a multiple of
289289
<em>em</em> without fractions.</p>
290290
</div>
@@ -420,6 +420,12 @@ <h3 id=layout-grid-line-prop><span class=secno>2.1. </span>Define Line
420420
<p>This property defines a line grid for the element and its descendent
421421
elements. Possible values are:
422422

423+
<p class=issue>An implementer said the grid's scope should be limited to
424+
the same BFC, as referring property values and position of parent elements
425+
could be difficult to implement if the element is in different BFC than
426+
the parent. This can mean a float cannot share the grids with its parent,
427+
which is not ideal. How can we solve this?
428+
423429
<dl>
424430
<dt><dfn id=none title="layout-grid-line::none">&lsquo;<code
425431
class=css>none</code>&rsquo;</dfn>
@@ -456,6 +462,8 @@ <h3 id=layout-grid-line-prop><span class=secno>2.1. </span>Define Line
456462
class=css>vertical-rl</code>&rsquo;, and the left of the element for
457463
&lsquo;<code class=css>vertical-lr</code>&rsquo;.
458464

465+
<p class=issue>Define behavior for paged media/column break
466+
459467
<p class=issue>TBD: I might need to copy more text from <a
460468
href="http://www.w3.org/TR/2001/WD-css3-text-20010517/#layout-grid-line-prop">CSS3
461469
module: text WD 20010517</a>.
@@ -689,13 +697,79 @@ <h3 id=grid-length-unit><span class=secno>3.3. </span>The &lsquo;<code
689697
<!-- --></code></pre>
690698
</div>
691699

700+
<p class=issue>&lsquo;<code class=css>gem</code>&rsquo; length unit is also
701+
requested
702+
692703
<h3 id=forcing-line-width-to-multiple-of-em><span class=secno>3.4.
693704
</span>Forcing Line Width to Multiple of <em>em</em></h3>
694705

695-
<p class=issue>There are multiple ideas for this, and all ideas are listed
696-
here for disucssions.
706+
<p class=issue>There are 3 ideas for this, and all ideas are listed here
707+
for disucssions.
708+
709+
<h4 id=character-grid-the-layout-grid-char-prop><span class=secno>3.4.1.
710+
</span>Character Grid: the &lsquo;<a href="#layout-grid-char"><code
711+
class=property>layout-grid-char</code></a>&rsquo; property</h4>
712+
713+
<table class=propdef>
714+
<tbody>
715+
<tr>
716+
<th>Name:
717+
718+
<td><dfn id=layout-grid-char>layout-grid-char</dfn>
719+
720+
<tr>
721+
<th>Value:
722+
723+
<td>none | auto | &lt;length&gt;
724+
725+
<tr>
726+
<th>Initial:
727+
728+
<td>none
729+
730+
<tr>
731+
<th>Applies to:
732+
733+
<td>block containers
734+
735+
<tr>
736+
<th>Inherited:
737+
738+
<td>no
739+
740+
<tr>
741+
<th>Percentages:
742+
743+
<td>N/A
744+
745+
<tr>
746+
<th>Media:
747+
748+
<td>visual
749+
750+
<tr>
751+
<th>Computed&nbsp;value:
752+
753+
<td>specified value
754+
</table>
755+
756+
<p>This property defines a character grid for the element. Possible values
757+
are:
758+
759+
<p>When a character grid is defined, start and end edges of a line box snap
760+
to the nearest grid in the direction to shorten the line box.
761+
762+
<div class=figure> <object data=line-length.svg height=158
763+
type="image/svg+xml" width=340> </object>
764+
<p class=caption>The gray part of a line box is rounded down to snap to
765+
the grid. The second line box has a float on the left (green), and
766+
therefore its start edge snaps to the grid as well.</p>
767+
</div>
768+
769+
<p class=issue>Should we add &lsquo;<code class=css>edges</code>&rsquo; to
770+
the &lsquo;<code class=property>line-grid-mode</code>&rsquo; property?
697771

698-
<h4 id=round-length><span class=secno>3.4.1. </span>Rounding Lengths to
772+
<h4 id=round-length><span class=secno>3.4.2. </span>Rounding Lengths to
699773
Multiple of Units: &lsquo;<code class=css><span class=index id=rounddown
700774
title="length unit::rounddown()">rounddown()</span></code>&rsquo; and
701775
&lsquo;<code class=css><span class=index id=roundup title="length
@@ -756,7 +830,7 @@ <h4 id=round-length><span class=secno>3.4.1. </span>Rounding Lengths to
756830
<!-- --></code></pre>
757831
</div>
758832

759-
<h4 id=rounding-lengths-to-multiple-of-units-th><span class=secno>3.4.2.
833+
<h4 id=rounding-lengths-to-multiple-of-units-th><span class=secno>3.4.3.
760834
</span>Rounding Lengths to Multiple of Units: the &lsquo;<a
761835
href="#layout-grid-measure"><code
762836
class=property>layout-grid-measure</code></a>&rsquo; property</h4>
@@ -804,66 +878,6 @@ <h4 id=rounding-lengths-to-multiple-of-units-th><span class=secno>3.4.2.
804878
<td>specified value
805879
</table>
806880

807-
<h4 id=character-grid-the-layout-grid-char-prop><span class=secno>3.4.3.
808-
</span>Character Grid: the &lsquo;<a href="#layout-grid-char"><code
809-
class=property>layout-grid-char</code></a>&rsquo; property</h4>
810-
811-
<table class=propdef>
812-
<tbody>
813-
<tr>
814-
<th>Name:
815-
816-
<td><dfn id=layout-grid-char>layout-grid-char</dfn>
817-
818-
<tr>
819-
<th>Value:
820-
821-
<td>none | auto | &lt;length&gt;
822-
823-
<tr>
824-
<th>Initial:
825-
826-
<td>none
827-
828-
<tr>
829-
<th>Applies to:
830-
831-
<td>block containers
832-
833-
<tr>
834-
<th>Inherited:
835-
836-
<td>no
837-
838-
<tr>
839-
<th>Percentages:
840-
841-
<td>N/A
842-
843-
<tr>
844-
<th>Media:
845-
846-
<td>visual
847-
848-
<tr>
849-
<th>Computed&nbsp;value:
850-
851-
<td>specified value
852-
</table>
853-
854-
<p>This property defines a character grid for the element. Possible values
855-
are:
856-
857-
<p>When a character grid is defined, the start and end edge of a line box
858-
snap to the nearest grid in the direction to shorten the line box.
859-
860-
<div class=figure> <object data=line-length.svg height=158
861-
type="image/svg+xml" width=340> </object>
862-
<p class=caption>The gray part of a line box is rounded down to snap to
863-
the grid. The second line box has a float on the left (green), and
864-
therefore its start edge snaps to the grid as well.</p>
865-
</div>
866-
867881
<h2 id=conformance><span class=secno>4. </span> Conformance</h2>
868882

869883
<h3 id=conformance-classes><span class=secno>4.1. </span> Conformance
@@ -1084,7 +1098,7 @@ <h2 class=no-num id=index>Index</h2>
10841098
tool"><strong>4.1.</strong></a>
10851099

10861100
<li>layout-grid-char, <a href="#layout-grid-char"
1087-
title=layout-grid-char><strong>3.4.3.</strong></a>
1101+
title=layout-grid-char><strong>3.4.1.</strong></a>
10881102

10891103
<li>layout-grid-line, <a href="#layout-grid-line"
10901104
title=layout-grid-line><strong>2.1.</strong></a>
@@ -1103,7 +1117,7 @@ <h2 class=no-num id=index>Index</h2>
11031117
</ul>
11041118

11051119
<li>layout-grid-measure, <a href="#layout-grid-measure"
1106-
title=layout-grid-measure><strong>3.4.2.</strong></a>
1120+
title=layout-grid-measure><strong>3.4.3.</strong></a>
11071121

11081122
<li>layout-grid-mode, <a href="#layout-grid-mode"
11091123
title=layout-grid-mode><strong>3.1.</strong></a>
@@ -1126,8 +1140,8 @@ <h2 class=no-num id=index>Index</h2>
11261140
<li>gd, <a href="#gd" title="length unit, gd">3.3.</a>
11271141

11281142
<li>rounddown(), <a href="#rounddown" title="length unit,
1129-
rounddown()">3.4.1.</a>, <a href="#roundup" title="length unit,
1130-
rounddown()">3.4.1.</a>
1143+
rounddown()">3.4.2.</a>, <a href="#roundup" title="length unit,
1144+
rounddown()">3.4.2.</a>
11311145
</ul>
11321146

11331147
<li>renderer, <a href="#renderer" title=renderer><strong>4.1.</strong></a>

css-line-grid/Overview.src.html

+61-50
Original file line numberDiff line numberDiff line change
@@ -146,7 +146,7 @@ <h3 id="context">Background</h3>
146146

147147
<div id="ex-width" class="sidefigure">
148148
<img src="width-multiple-of-em.png"
149-
width="206" height="168"
149+
width="180" height="142"
150150
alt="East Asian layouts may require width be a multiple of em without fractions"
151151
/>
152152
<p class="caption">East Asian layouts may require width
@@ -260,6 +260,13 @@ <h3 id="layout-grid-line-prop">Define Line Grids: the 'layout-grid-line' propert
260260

261261
<p>This property defines a line grid for the element and its descendent elements.
262262
Possible values are:</p>
263+
264+
<p class="issue">An implementer said the grid's scope should be limited to the same BFC,
265+
as referring property values and position of parent elements could be difficult to implement
266+
if the element is in different BFC than the parent.
267+
This can mean a float cannot share the grids with its parent, which is not ideal.
268+
How can we solve this?</p>
269+
263270
<dl>
264271
<dt><dfn title="layout-grid-line::none">''none''</dfn></dt>
265272
<dd>No line grid is specified.</dd>
@@ -282,6 +289,7 @@ <h3 id="layout-grid-line-prop">Define Line Grids: the 'layout-grid-line' propert
282289
for 'writing-mode' is ''vertical-rl'',
283290
and the left of the element for ''vertical-lr''.</p>
284291

292+
<p class="issue">Define behavior for paged media/column break</p>
285293
<p class="issue">TBD:
286294
I might need to copy more text from
287295
<a href="http://www.w3.org/TR/2001/WD-css3-text-20010517/#layout-grid-line-prop">CSS3 module: text WD 20010517</a>.</p>
@@ -491,8 +499,60 @@ <h3 id="grid-length-unit">The ''<span class="index" title="length unit::gd">gd</
491499
<!-- --></code></pre>
492500
</div>
493501

502+
<p class="issue">''gem'' length unit is also requested</p>
503+
494504
<h3>Forcing Line Width to Multiple of <em>em</em></h3>
495505
<p class="issue">There are 3 ideas for this, and all ideas are listed here for disucssions.</p>
506+
507+
<h4>Character Grid: the 'layout-grid-char' property</h4>
508+
509+
<table class=propdef>
510+
<tr>
511+
<th>Name:
512+
<td><dfn>layout-grid-char</dfn>
513+
<tr>
514+
<th>Value:
515+
<td>none
516+
| auto
517+
| &lt;length&gt;
518+
<tr>
519+
<th>Initial:
520+
<td>none
521+
<tr>
522+
<th>Applies to:
523+
<td>block containers
524+
<tr>
525+
<th>Inherited:
526+
<td>no
527+
<tr>
528+
<th>Percentages:
529+
<td>N/A
530+
<tr>
531+
<th>Media:
532+
<td>visual
533+
<tr>
534+
<th>Computed&nbsp;value:
535+
<td>specified value
536+
</table>
537+
538+
<p>This property defines a character grid for the element. Possible values are:</p>
539+
540+
<p>When a character grid is defined,
541+
start and end edges of a line box snap to the nearest grid
542+
in the direction to shorten the line box.</p>
543+
544+
<div class="figure">
545+
<object
546+
data="line-length.svg" type="image/svg+xml"
547+
width="340" height="158">
548+
</object>
549+
<p class="caption">The gray part of a line box is rounded down to snap to the grid.
550+
The second line box has a float on the left (green),
551+
and therefore its start edge snaps to the grid as well.</p>
552+
</div>
553+
554+
<p class="issue">Should we add ''edges'' to the 'line-grid-mode' property?</p>
555+
496556
<h4 id="round-length">Rounding Lengths to Multiple of Units:
497557
''<span class="index" title="length unit::rounddown()">rounddown()</span>''
498558
and ''<span class="index" title="length unit::rounddown()">roundup()</span>''
@@ -580,55 +640,6 @@ <h4>Rounding Lengths to Multiple of Units: the 'layout-grid-measure' property</h
580640
<td>specified value
581641
</table>
582642

583-
<h4>Character Grid: the 'layout-grid-char' property</h4>
584-
585-
<table class=propdef>
586-
<tr>
587-
<th>Name:
588-
<td><dfn>layout-grid-char</dfn>
589-
<tr>
590-
<th>Value:
591-
<td>none
592-
| auto
593-
| &lt;length&gt;
594-
<tr>
595-
<th>Initial:
596-
<td>none
597-
<tr>
598-
<th>Applies to:
599-
<td>block containers
600-
<tr>
601-
<th>Inherited:
602-
<td>no
603-
<tr>
604-
<th>Percentages:
605-
<td>N/A
606-
<tr>
607-
<th>Media:
608-
<td>visual
609-
<tr>
610-
<th>Computed&nbsp;value:
611-
<td>specified value
612-
</table>
613-
614-
<p>This property defines a character grid for the element. Possible values are:</p>
615-
616-
<p>When a character grid is defined,
617-
start and end edges of a line box snap to the nearest grid
618-
in the direction to shorten the line box.</p>
619-
620-
<div class="figure">
621-
<object
622-
data="line-length.svg" type="image/svg+xml"
623-
width="340" height="158">
624-
</object>
625-
<p class="caption">The gray part of a line box is rounded down to snap to the grid.
626-
The second line box has a float on the left (green),
627-
and therefore its start edge snaps to the grid as well.</p>
628-
</div>
629-
630-
631-
632643
<h2 id="conformance">
633644
Conformance</h2>
634645

-1.23 KB
Loading

0 commit comments

Comments
 (0)