[csswg-drafts] [css-grid] Manage GRID cell as FLEX. (#6714)

korenevskiy has just created a new issue for https://github.com/w3c/csswg-drafts:

== [css-grid] Manage GRID cell as FLEX. ==
Adding support for styles like this
```
grid-direction: ...;
grid-wrap: ...;
```
in GRID
We perceive GRID as something more advanced than FLEX.
But if we draw an analogy, we can see that if FLEX is a full-fledged completed embodiment of the idea. Then the GRID is not finished.
There is a proposal to complete the idea of GRID. I propose to make each GRID cell similar to the FLEX markup.
So we need style properties
```
grid-direction: ...;
grid-wrap: ...;
```
Appointment:
We use a grid for the site: Header, modules, footer and content.
by setting a position in the grid for each block, we can solve our problems, but only apart from one important problem we have not solved.
If we place several articles in the grid in the content position, then the articles will overlap each other. But the number of articles is an indefinite and unknown quantity in the layout. Today there is 1 news on the site, and tomorrow there is already a lot of news. We are forced to use nested tags. But it happens that nested positions require stretching into several columns.

Or for example, you add a second news block to the page, we do not need to rewrite the layout, we need to create a nesting of blocks. If we can manage each cell as FLEX, then by setting `grid-direction: column;`
we will get the ordering of news blocks in one cell.

Do you think it would be useful for you to use the GRID-DIRECTION and GRID-WRAP properties managing each cell as FLEX.?
```
body{
display:grid;
grid-direction: column;
grid-template-areas: "left content right";
}
.content{
grid-area: content;
}
```
```
<div class='content'>Blog article one</div>
<div class='content'>Blog article two</div>
<div class='content'>Blog article three</div>
```
All these blocks are now arranged in one cell as a column.

Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/6714 using your GitHub account


-- 
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config

Received on Monday, 4 October 2021 17:24:54 UTC