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
<pclass=p-summarydata-fill-with=abstract><p>This CSS module defines a two-dimensional grid-based layout system, optimized for user interface design. In the grid layout model, the children of a grid container can be positioned into arbitrary slots in a flexible or fixed predefined layout grid.</p>
125
+
<divclass=p-summarydata-fill-with=abstract><p>This CSS module defines a two-dimensional grid-based layout system, optimized for user interface design. In the grid layout model, the children of a grid container can be positioned into arbitrary slots in a flexible or fixed predefined layout grid.</p>
126
126
127
127
<ahref=http://www.w3.org/TR/CSS/>CSS</a> is a language for describing the rendering of structured documents
128
128
(such as HTML and XML)
129
-
on screen, on paper, in speech, etc.</p>
129
+
on screen, on paper, in speech, etc.</div>
130
130
131
131
<h2class="no-num no-toc no-ref heading settled heading" id=status><spanclass=content>Status of this document</span></h2>
<li><ahref=#grid-containers><spanclass=secno>3.1</span> Establishing Grid Containers: the <span>grid</span> and <span>inline-grid</span><span>display</span> values</a>
178
+
<li><ahref=#grid-containers><spanclass=secno>3.1</span> Establishing Grid Containers: the <spanclass=cssdata-link-for=displaydata-link-type=maybetitle=grid>grid</span> and <spanclass=cssdata-link-type=maybetitle=inline-grid>inline-grid</span><spanclass=propertydata-link-type=propdesctitle=display>display</span> values</a>
<li><ahref=#visibility-collapse><spanclass=secno>4.1</span> Collapsed Grid Items: the <span>visibility</span> property</a>
183
-
<li><ahref=#order-property><spanclass=secno>4.2</span> Reordered Grid Items: the <span>order</span> property</a>
182
+
<li><ahref=#visibility-collapse><spanclass=secno>4.1</span> Collapsed Grid Items: the <spanclass=propertydata-link-type=propdesctitle=visibility>visibility</span> property</a>
183
+
<li><ahref=#order-property><spanclass=secno>4.2</span> Reordered Grid Items: the <spanclass=propertydata-link-type=propdesctitle=order>order</span> property</a>
184
184
<li><ahref=#static-position><spanclass=secno>4.3</span> Static Position of Grid Container Children</a></ul>
185
185
<li><ahref=#grid-definition><spanclass=secno>5</span> The Explicit Grid</a>
186
186
<ulclass=toc>
187
-
<li><ahref=#track-sizing><spanclass=secno>5.1</span> Track Sizing: the <span>grid-template-rows</span> and <span>grid-template-columns</span> properties</a>
187
+
<li><ahref=#track-sizing><spanclass=secno>5.1</span> Track Sizing: the <spanclass=propertydata-link-type=propdesctitle=grid-template-rows>grid-template-rows</span> and <spanclass=propertydata-link-type=propdesctitle=grid-template-columns>grid-template-columns</span> properties</a>
188
188
<ulclass=toc>
189
-
<li><ahref=#named-lines><spanclass=secno>5.1.1</span> Named Grid Lines: the ''(<span><custom-ident></span>*)'' syntax</a>
190
-
<li><ahref=#repeat-notation><spanclass=secno>5.1.2</span> Repeating Rows and Columns: the <span>repeat()</span> notation</a>
189
+
<li><ahref=#named-lines><spanclass=secno>5.1.1</span> Named Grid Lines: the ''(<spanclass=productiondata-link-type=typetitle="<custom-ident>"><custom-ident></span>*)'' syntax</a>
190
+
<li><ahref=#repeat-notation><spanclass=secno>5.1.2</span> Repeating Rows and Columns: the <spanclass=cssdata-link-type=maybetitle=repeat()>repeat()</span> notation</a>
191
191
<li><ahref=#fr-unit><spanclass=secno>5.1.3</span> Flexible Lengths: the <spanclass=cssdata-link-type=maybetitle=fr>fr</span> unit</a>
192
-
<li><ahref=#subgrids><spanclass=secno>5.1.4</span> Subgrids: the <span>subgrid</span> keyword</a>
192
+
<li><ahref=#subgrids><spanclass=secno>5.1.4</span> Subgrids: the <spanclass=cssdata-link-for=grid-template-rowsdata-link-type=maybetitle=subgrid>subgrid</span> keyword</a>
<li><ahref=#grid-template-areas-property><spanclass=secno>5.2</span> Named Areas: the <span>grid-template-areas</span> property</a>
194
+
<li><ahref=#grid-template-areas-property><spanclass=secno>5.2</span> Named Areas: the <spanclass=propertydata-link-type=propdesctitle=grid-template-areas>grid-template-areas</span> property</a>
195
195
<ulclass=toc>
196
196
<li><ahref=#implicit-named-lines><spanclass=secno>5.2.1</span> Implicit Named Lines</a>
197
197
<li><ahref=#implicit-named-areas><spanclass=secno>5.2.2</span> Implicit Named Areas</a></ul>
198
-
<li><ahref=#explicit-grid-shorthand><spanclass=secno>5.3</span> Explicit Grid Shorthand: the <span>grid-template</span> property</a></ul>
198
+
<li><ahref=#explicit-grid-shorthand><spanclass=secno>5.3</span> Explicit Grid Shorthand: the <spanclass=propertydata-link-type=propdesctitle=grid-template>grid-template</span> property</a></ul>
199
199
<li><ahref=#implicit-grids><spanclass=secno>6</span> The Implicit Grid</a>
200
200
<ulclass=toc>
201
-
<li><ahref=#auto-tracks><spanclass=secno>6.1</span> Sizing Auto-generated Rows and Columns: the <span>grid-auto-rows</span> and <span>grid-auto-columns</span> properties</a>
202
-
<li><ahref=#grid-auto-flow-property><spanclass=secno>6.2</span> Automatic Placement: the <span>grid-auto-flow</span> property</a>
201
+
<li><ahref=#auto-tracks><spanclass=secno>6.1</span> Sizing Auto-generated Rows and Columns: the <spanclass=propertydata-link-type=propdesctitle=grid-auto-rows>grid-auto-rows</span> and <spanclass=propertydata-link-type=propdesctitle=grid-auto-columns>grid-auto-columns</span> properties</a>
202
+
<li><ahref=#grid-auto-flow-property><spanclass=secno>6.2</span> Automatic Placement: the <spanclass=propertydata-link-type=propdesctitle=grid-auto-flow>grid-auto-flow</span> property</a>
<li><ahref=#common-uses-named-lines><spanclass=secno>8.1.3</span> Named Lines and Spans</a>
213
213
<li><ahref=#common-uses-auto-placement><spanclass=secno>8.1.4</span> Auto Placement</a>
214
214
<li><ahref=#common-uses-auto-sizing><spanclass=secno>8.1.5</span> Auto Sizing Subgrids</a></ul>
215
-
<li><ahref=#line-placement><spanclass=secno>8.2</span> Line-based Placement: the <span>grid-row-start</span>, <span>grid-column-start</span>, <span>grid-row-end</span>, and <span>grid-column-end</span> properties</a>
215
+
<li><ahref=#line-placement><spanclass=secno>8.2</span> Line-based Placement: the <spanclass=propertydata-link-type=propdesctitle=grid-row-start>grid-row-start</span>, <spanclass=propertydata-link-type=propdesctitle=grid-column-start>grid-column-start</span>, <spanclass=propertydata-link-type=propdesctitle=grid-row-end>grid-row-end</span>, and <spanclass=propertydata-link-type=propdesctitle=grid-column-end>grid-column-end</span> properties</a>
<li><ahref=#placement-shorthands><spanclass=secno>8.3</span> Placement Shorthands: the <span>grid-column</span>, <span>grid-row</span>, and <span>grid-area</span> properties</a>
218
+
<li><ahref=#placement-shorthands><spanclass=secno>8.3</span> Placement Shorthands: the <spanclass=propertydata-link-type=propdesctitle=grid-column>grid-column</span>, <spanclass=propertydata-link-type=propdesctitle=grid-row>grid-row</span>, and <spanclass=propertydata-link-type=propdesctitle=grid-area>grid-area</span> properties</a>
<li><ahref=#auto-margins><spanclass=secno>9.1</span> Aligning with <span>auto</span> margins</a>
223
-
<li><ahref=#row-align><spanclass=secno>9.2</span> Row-axis Alignment: the <span>justify-self</span> and <span>justify-items</span> properties</a>
224
-
<li><ahref=#column-align><spanclass=secno>9.3</span> Column-axis Alignment: the <span>align-self</span> and <span>align-items</span> properties</a>
225
-
<li><ahref=#grid-align><spanclass=secno>9.4</span> Aligning the Grid: the <span>justify-content</span> and <span>align-content</span> properties</a>
226
-
<li><ahref=#z-order><spanclass=secno>9.5</span> Z-axis Ordering: the <span>z-index</span> property</a>
222
+
<li><ahref=#auto-margins><spanclass=secno>9.1</span> Aligning with <spandata-link-for=margindata-link-type=valuetitle=auto>auto</span> margins</a>
223
+
<li><ahref=#row-align><spanclass=secno>9.2</span> Row-axis Alignment: the <spanclass=propertydata-link-type=propdesctitle=justify-self>justify-self</span> and <spanclass=propertydata-link-type=propdesctitle=justify-items>justify-items</span> properties</a>
224
+
<li><ahref=#column-align><spanclass=secno>9.3</span> Column-axis Alignment: the <spanclass=propertydata-link-type=propdesctitle=align-self>align-self</span> and <spanclass=propertydata-link-type=propdesctitle=align-items>align-items</span> properties</a>
225
+
<li><ahref=#grid-align><spanclass=secno>9.4</span> Aligning the Grid: the <spanclass=propertydata-link-type=propdesctitle=justify-content>justify-content</span> and <spanclass=propertydata-link-type=propdesctitle=align-content>align-content</span> properties</a>
226
+
<li><ahref=#z-order><spanclass=secno>9.5</span> Z-axis Ordering: the <spanclass=propertydata-link-type=propdesctitle=z-index>z-index</span> property</a>
0 commit comments