Skip to content

Commit 13ce89c

Browse files
committed
[css-gaps-1][editorial] Fix rule-visibility examples
1 parent f0635e6 commit 13ce89c

7 files changed

Lines changed: 11 additions & 15 deletions

css-gaps-1/Overview.bs

Lines changed: 11 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -1113,61 +1113,57 @@ Gap decoration visibility: The 'rule-visibility-items' properties</h3>
11131113

11141114
<div class="example">
11151115
<pre>
1116-
.break-normal-with-around-grid {
1116+
.break-normal-with-all-grid {
11171117
display: grid;
11181118
grid-template: repeat(3, 100px) / repeat(3, 100px);
11191119
gap: 20px;
11201120
row-rule: 6px solid red;
11211121
column-rule: 6px solid blue;
1122-
rule-visibility-items: around;
1122+
rule-visibility-items: all;
11231123
}
11241124
</pre>
11251125
<figure>
1126-
<img alt="" src="images/example-vis-rules-around-spn.png">
1126+
<img alt="" src="images/example-visibility-all-normal.png">
11271127
<figcaption>
1128-
Gap decorations with 'rule-break' ''column-rule-break/normal'' and 'rule-visibility-items' ''column-rule-visibility-items/around''.
1128+
Gap decorations in Grid with ''column-rule-break/normal'' rule breaking and ''column-rule-visibility-items/all'' visibility (the default).
11291129
</figcaption>
11301130
</figure>
11311131
</div>
11321132

11331133
<div class="example">
11341134
<pre>
1135-
.break-intersection-with-around-grid {
1135+
.break-normal-with-around-grid {
11361136
display: grid;
11371137
grid-template: repeat(3, 100px) / repeat(3, 100px);
11381138
gap: 20px;
11391139
row-rule: 6px solid red;
11401140
column-rule: 6px solid blue;
1141-
rule-inset: 0px;
11421141
rule-visibility-items: around;
1143-
rule-break: intersection;
11441142
}
11451143
</pre>
11461144
<figure>
1147-
<img alt="" src="images/example-vis-rules-around-int.png">
1145+
<img alt="" src="images/example-visibility-around-normal.png">
11481146
<figcaption>
1149-
Gap decorations with and 'rule-break' ''column-rule-break/intersection'' and 'rule-visibility-items' ''column-rule-visibility-items/around''.
1147+
Gap decorations in Grid with ''column-rule-break/normal'' rule breaking and ''column-rule-visibility-items/around'' visibility.
11501148
</figcaption>
11511149
</figure>
11521150
</div>
1153-
1151+
11541152
<div class="example">
11551153
<pre>
1156-
.break-intersection-with-between-grid {
1154+
.break-normal-with-between-grid {
11571155
display: grid;
11581156
grid-template: repeat(3, 100px) / repeat(3, 100px);
11591157
gap: 20px;
11601158
row-rule: 6px solid red;
11611159
column-rule: 6px solid blue;
1162-
rule-inset: 0px;
11631160
rule-visibility-items: between;
1164-
rule-break: intersection;
11651161
}
11661162
</pre>
11671163
<figure>
1168-
<img alt="" src="images/example-vis-rules-btwn-int.png">
1164+
<img alt="" src="images/example-visibility-between-normal.png">
11691165
<figcaption>
1170-
Gap decorations with 'rule-break' ''column-rule-break/intersection'' and 'rule-visibility-items' ''column-rule-visibility-items/between''.
1166+
Gap decorations in Grid with ''column-rule-break/normal'' rule breaking and ''column-rule-visibility-items/between'' visibility.
11711167
</figcaption>
11721168
</figure>
11731169
</div>
-1.52 KB
Binary file not shown.
-1.6 KB
Binary file not shown.
-1.47 KB
Binary file not shown.
7.62 KB
Loading
7.84 KB
Loading
7.63 KB
Loading

0 commit comments

Comments
 (0)