W3C home > Mailing lists > Public > public-css-archive@w3.org > March 2020

Re: [csswg-drafts] [css-grid] Allow naming grid rows and columns and allow a grid item to span named grid areas/rows/columns... (#4892)

From: Oriol Brufau via GitHub <sysbot+gh@w3.org>
Date: Tue, 24 Mar 2020 01:38:10 +0000
To: public-css-archive@w3.org
Message-ID: <issue_comment.created-602956749-1585013889-sysbot+gh@w3.org>
If `/` confuses you then you can expand all the way to the longhands:

```css
grid-area: B2 / C4;
/* equivalent to */
grid-row-start: B2;
grid-row-end: B2;
grid-column-start: C4;
grid-column-end: C4;
```

```css
grid-area: B2 / B2 / C4 / C4;
/* equivalent to */
grid-row-start: B2;
grid-row-end: C4;
grid-column-start: B2;
grid-column-end: C4;
```

> as writing everything twice feels rather odd and unintuitive

You need to write it twice because there are 2 axes.

> Are there any resources that explain this in more detail?

These are the relevant sections in the spec:

 - [§7.2.2. Naming Grid Lines](https://drafts.csswg.org/css-grid/#named-lines)
 - [§8. Placing Grid Items](https://drafts.csswg.org/css-grid/#placement)


-- 
GitHub Notification of comment by Loirooriol
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/4892#issuecomment-602956749 using your GitHub account
Received on Tuesday, 24 March 2020 01:38:11 UTC

This archive was generated by hypermail 2.4.0 : Tuesday, 5 July 2022 06:42:02 UTC