You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: css-inline-3/Overview.bs
+22-22Lines changed: 22 additions & 22 deletions
Original file line number
Diff line number
Diff line change
@@ -46,7 +46,7 @@ Line Heights and Baseline Alignment</h2>
46
46
<p class="issue">This section is being rewritten. Refer to <a href="https://www.w3.org/TR/CSS2/visudet.html#line-height">section 10.8</a> of [[CSS2]] for the normative CSS definition or the <a href="https://www.w3.org/TR/2002/WD-css3-linebox-20020515/">2002 Working Draft</a> if you want pretty pictures. (But ignore the old text, half of it's wrong. We're not specifying which half, that's to be determined.)
47
47
<strong>The CSS2 specification should be used as the guideline for implementation.</strong></p>
48
48
49
-
Issue: The CSSWG would like to know which baseline values are necessary: if any can be dropped, or any need to be added. See GitHub issue <a href="https://github.com/w3c/csswg-drafts/issues/859">859</a>.
49
+
Issue: The CSSWG would like to know which baseline values are necessary: if any can be dropped, or any need to be added. See GitHub issue <a href="https://github.com/w3c/csswg-drafts/issues/859">859</a>.
50
50
51
51
<h3 id="dominant-baseline-property">
52
52
Dominant Baselines: the 'dominant-baseline' property</h3>
Copy file name to clipboardExpand all lines: css-multicol-1/Overview.bs
+39-39Lines changed: 39 additions & 39 deletions
Original file line number
Diff line number
Diff line change
@@ -196,7 +196,7 @@ The multi-column model</h2>
196
196
<figure>
197
197
<img alt="a diagram showing the various parts of multi-column layout" src="images/initial-example-b.svg">
198
198
<figcaption>The same layout as in the first image, as it would be displayed by an implementation.</figcaption>
199
-
</figure>
199
+
</figure>
200
200
</div>
201
201
202
202
If the multi-column container is paginated, the height of each row is
@@ -216,7 +216,7 @@ The multi-column model</h2>
216
216
</div>
217
217
218
218
Column boxes are block container boxes. The multi-column container is the principal box, and column boxes are anonymous.
219
-
219
+
220
220
Note: Column boxes do not become the containing block for elements with ''position: fixed'' or ''position: absolute''. The containing block is the multicol element, it being the principal box.
221
221
222
222
<div class="example">
@@ -227,7 +227,7 @@ The multi-column model</h2>
227
227
position: relative;
228
228
column-count: 3;
229
229
}
230
-
img {
230
+
img {
231
231
position: absolute;
232
232
top: 20px;
233
233
left: 40px;
@@ -520,14 +520,14 @@ Two assumptions are being made by the pseudo-algorithm:
520
520
In this example, the actual column-count is higher than the used column-count due to explicit column breaks:
521
521
522
522
<pre highlight="css">
523
-
div {
524
-
width: 40em;
525
-
columns: 20em;
526
-
column-gap: 0;
523
+
div {
524
+
width: 40em;
525
+
columns: 20em;
526
+
column-gap: 0;
527
527
}
528
528
529
-
p {
530
-
break-after: column;
529
+
p {
530
+
break-after: column;
531
531
}
532
532
</pre>
533
533
@@ -724,7 +724,7 @@ Column gaps and rules</h2>
724
724
</div>
725
725
726
726
727
-
727
+
728
728
729
729
<h2 id="column-breaks">
730
730
Column breaks</h2>
@@ -834,9 +834,9 @@ section {
834
834
padding-top: 2em;
835
835
}
836
836
837
-
h2 {
838
-
column-span: all;
839
-
background: silver
837
+
h2 {
838
+
column-span: all;
839
+
background: silver
840
840
}
841
841
</pre>
842
842
@@ -881,7 +881,7 @@ h2 {
881
881
In paged media spanning elements are honored on all pages.
882
882
In this example, the first three paragraphs have column breaks after them.
883
883
An spanning <code>H2</code> element appears after the fourth paragraph.
884
-
884
+
885
885
886
886
<figure>
887
887
<img src="images/spanner-page-break1.svg" alt="Three columns with two lines of text each">
@@ -982,30 +982,30 @@ Filling columns</h2>
982
982
columns due to column balancing.
983
983
984
984
<pre highlight="css">
985
-
article {
986
-
width: 60em;
987
-
height: auto;
988
-
columns: 4;
989
-
column-fill: balance;
985
+
article {
986
+
width: 60em;
987
+
height: auto;
988
+
columns: 4;
989
+
column-fill: balance;
990
990
}
991
991
</pre>
992
992
993
993
<figure>
994
994
<img src="images/column-balancing-one-paragraph.svg" alt="Four columns, the first three have content.">
995
995
<figcaption>Three lines displayed in three columns due to column balancing.</figcaption>
996
996
</figure>
997
-
997
+
998
998
</div>
999
999
1000
1000
<div class="example">
1001
1001
In this example, column balancing is turned off:
1002
1002
1003
1003
<pre highlight="css">
1004
-
article {
1005
-
width: 60em;
1006
-
height: auto;
1007
-
columns: 4;
1008
-
column-fill: auto;
1004
+
article {
1005
+
width: 60em;
1006
+
height: auto;
1007
+
columns: 4;
1008
+
column-fill: auto;
1009
1009
}
1010
1010
</pre>
1011
1011
@@ -1021,15 +1021,15 @@ Filling columns</h2>
1021
1021
In this example, an article has two paragraphs: first a long one, then a shorter one. This code is applied:
1022
1022
1023
1023
<pre highlight="css">
1024
-
article {
1025
-
width: 60em;
1026
-
height: auto;
1027
-
columns: 4;
1028
-
column-fill: balance;
1024
+
article {
1025
+
width: 60em;
1026
+
height: auto;
1027
+
columns: 4;
1028
+
column-fill: balance;
1029
1029
}
1030
1030
1031
-
p {
1032
-
break-after: column;
1031
+
p {
1032
+
break-after: column;
1033
1033
}
1034
1034
</pre>
1035
1035
@@ -1046,11 +1046,11 @@ Filling columns</h2>
1046
1046
1047
1047
<div class="example">
1048
1048
<pre highlight="css">
1049
-
article {
1050
-
width: 60em;
1051
-
height: auto;
1052
-
columns: 4;
1053
-
column-fill: balance;
1049
+
article {
1050
+
width: 60em;
1051
+
height: auto;
1052
+
columns: 4;
1053
+
column-fill: balance;
1054
1054
}
1055
1055
</pre>
1056
1056
@@ -1138,11 +1138,11 @@ Pagination and overflow outside multicol containers</h3>
1138
1138
<img src="images/height-constraint-overflow-inline.svg" alt="Four columns, one outside the multicol container">
1139
1139
<figcaption>An overflow column is created in the inline direction.</figcaption>
1140
1140
</figure>
1141
-
1141
+
1142
1142
</div>
1143
1143
1144
1144
<div class="example">
1145
-
1145
+
1146
1146
In continuous media overflow columns can effect the height of the multicol container. In this example a column appears in the overflow which has four lines of text. The multicol container is made tall enough to accomodate this column.
0 commit comments