Re: [csswg-drafts] [css-selectors][css-flexbox] Pseudo-classes for flex-wrapped and rows elements (#5150)

• From: Sebastian Zartner via GitHub <sysbot+gh@w3.org>
• Date: Tue, 02 Jun 2020 20:20:28 +0000
• To: public-css-archive@w3.org
• Message-ID: <issue_comment.created-637784111-1591129226-sysbot+gh@w3.org>

Note that the pseudo-class would need to be applied to the child element, not the parent element, as it describes the state of the element it is applied to. So e.g. it should rather be
```
li:first-wrap-row {
  border-bottom: 2px solid black;
}
```

This could also apply to grid layout. Example:

HTML:
```
<div id="grid">
  <div>1</div>
  <div>2</div>
  <div>3</div>
  <div>4</div>
  <div>5</div>
  <div>6</div>
</div>
```

CSS:
```
#grid {
  display: grid;
  grid-template-columns: auto auto;
}

#grid > div:first-wrap-row {
  border-bottom: 2px solid black;
}
```

would result in
![First row styling of grid](https://user-images.githubusercontent.com/958943/83565339-8a881f00-a51e-11ea-93dd-8e12701fb1f5.png)

Selectors Level 4 already defines a `nth-col()` pseudo-class as "grid-structural selector", so it seems to be the suggested pseudo-classes could fit there, too. (Then probably without `-wrap` in their name.)

Sebastian

-- 
GitHub Notification of comment by SebastianZ
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/5150#issuecomment-637784111 using your GitHub account

Received on Tuesday, 2 June 2020 20:20:30 UTC