Both sides previous revisionPrevious revisionNext revision | Previous revisionNext revisionBoth sides next revision |
spec:css3-grid-layout [2011/12/04 15:00] – mmielke | spec:css3-grid-layout [2012/05/15 13:42] – [Issues for F2F] fantasai |
---|
Link to current Editor's draft: [[http://dev.w3.org/csswg/css3-grid-align/]] | Link to current Editor's draft: [[http://dev.w3.org/csswg/css3-grid-align/]] |
| |
| |
| ===== Issues for Hamburg F2F ===== |
| |
| === Scoping === |
| |
| - Scoping of Grid Layout and Template Layout specs |
| - Drop named lines from this level of Grid Layout |
| - Adopting column-gap etc., adding row equivalents, to handle gutters |
| |
| === Naming === |
| |
| - grid-flow: row | column | layer |
| - rename grid-rows --> grid-row-tracks, grid-columns --> grid-column-tracks |
| - auto/fit-content becomes fit-content |
| - grid positioning properties: |
| |
| ^ //grid-area// ^ grid-column ^ grid-row | |
| ^ grid-position | grid-column-position | grid-row-position | |
| ^ grid-span | grid-column-span | grid-row-span | |
| |
| = |
| |
| ^ //C R ΔC ΔR// ^ C ΔC ^ R ΔR | |
| ^ C R | C | R | |
| ^ ΔC ΔR | ΔC | ΔR | |
| |
| === Default handling of content === |
| |
| - auto-placement is progressive pack w/ pointer @ start before corner |
| - auto-placement vs. anonymous block |
| - default value of grid-flow? |
| - using "display: grid" vs implied grid lines |
| - default track sizing is an open issue, if you have ideas let us know |
| |
===== Action Items ===== | ===== Action Items ===== |
== Summary: == | == Summary: == |
| |
Grid-layer is currently used to control the stacking of grid items in a grid element; one example of this would be using Grid to build a range control where the "thumb" of the control is displayed on top of the underlying track. However, grid-layer is in many ways similar to the existing z-index property. Is a separate property needed, or can z-index replace the grid-layer property? | Grid-layer is currently used to control the stacking of grid items in a grid element; one example of this that is mentioned in the current Editor's Draft would be using Grid to build a range control where the "thumb" of the control is displayed on top of the underlying track. However, grid-layer is in many ways similar to the existing z-index property. Is a separate property needed, or can z-index replace the grid-layer property? |
| |
| We have three primary goals w/r/t stacking Grid Items: |
| |
| - Grid Items draw atomically. Like positioned elements, Grid has among its primary scenarios the ability to overlap and layer its items (see section 2.4 Grid Layering of Elements). To avoid a counter-intuitive interleaving of backgrounds, floats, and inline content, Grid Items should form a new stacking context. |
| - Grid Items are in front of the Grid Element, even when the Grid Item is given a negative z-index. Imagine an author using a tool, right-clicking an item and choosing "send to back" from a context menu. The tool should set a negative z-index on the Grid Item and not have the Grid Item disappear behind the background of the Grid Element. Also, if a nested Grid is given a positive z-index, it should not cover its Grid Items. Therefore we need the Grid Element to serve as a stacking context for its Grid Items. |
| - We want to avoid impacting any positioning scenarios. It would be unexpected if the author inadvertently changed the containing block or the stacking context for a positioned descendant just by inserting a Grid layout in its ancestry. |
| |
== Proposal: == | == Proposal: == |
| |
Z-index should be used to replace the grid-layer property. Specifically, in cases where Grid Items overlap, z-index provides control over the drawing order of Grid Items. Both Grid elements and Grid Items generate a stacking context as described for floats (step 5, section 14) in the [[http://www.w3.org/TR/2007/WD-css3-box-20070809/#stacking|CSS3 Box Model]]. Note that this would imply that z-index applies to statically positioned Grid Items. | Z-index should be used to replace the grid-layer property (i.e. z-index applies to statically-positioned Grid Items.) Specifically, in cases where Grid Items overlap, z-index provides control over the drawing order of Grid Items. Both Grid elements and Grid Items generate a stacking context as described for floats (step 5, section 14) in the [[http://www.w3.org/TR/2007/WD-css3-box-20070809/#stacking|CSS3 Box Model]]. |
| |
Note also that this change has been [[http://lists.w3.org/Archives/Public/www-style/2011May/0344.html|previously discussed]] on the www-styling mailing list. | Note also that using z-index in place of grid-layer has been [[http://lists.w3.org/Archives/Public/www-style/2011May/0344.html|previously discussed]] on the www-styling mailing list. |
| |
==== Issue 2: ==== | ==== Issue 2: ==== |
== Proposal: == | == Proposal: == |
| |
We propose to modify the existing grid sizing algorithm as follows: if the Grid Element is shrink-to-fit, then the algorithm follows its current path. However, if the Grid Element is not shrink-to-fit, then we set the size of a fractional track (i.e. determine the size of a '1fr' track) by making sure that 1) the proportions of all fractional tracks are preserved (e.g. a '1fr' track is half the size of a '2fr' track) and 2) fractional tracks are large enough contain all Grid Items that span them. The specific algorithm updates can be found in step 6 of the updated Editor's Draft. | We propose to modify the existing grid sizing algorithm as follows: if the Grid Element is shrink-to-fit, then we set the size of a fractional track (i.e. determine the size of a '1fr' track) by making sure that 1) the proportions of all fractional tracks are preserved (e.g. a '1fr' track is half the size of a '2fr' track) and 2) fractional tracks are large enough contain all Grid Items that span them. If the Grid Element is not shrink-to-fit, then the algorithm follows its current path. The specific algorithm updates can be found in step 6 of the updated Editor's Draft. |
| |
| |