- From: Sebastian Zartner via GitHub <sysbot+gh@w3.org>
- Date: Tue, 18 Oct 2016 07:06:32 +0000
- To: public-css-archive@w3.org
The most important part of this proposal is that it allows to get rid
of wrapper HTML elements, which are only used for layout purposes.
An example for this can be seen on this very GitHub page, which
currently has a structure like this:
```html
<div id="discussion_bucket" class="clearfix">
<div class="discussion-sidebar js-sticky is-stuck" style="position:
sticky;">
…
</div>
<div class="discussion-timeline js-quote-selection-container ">
…
</div>
</div>
```
With this pseudo-element it would be possible to replace the outer
`<div>` by a CSS rule like this:
```css
#show_issue::wrap(:first-child, :last-child) {
display: block;
}
#show_issue::wrap(:first-child, :last-child)::before {
content: "";
display: table;
}
#show_issue::wrap(:first-child, :last-child)::after {
clear: both;
content: "";
display: table;
}
```
*Note: This example also requires stacking of pseudo-elements. Though
even without pseudo-element stacking there are use cases for a wrapper
pseudo-element.*
Sebastian
PS: @Ian-Y, please change the summary to "Add wrapper pseudo element"
to be more general (and remove [css3-selector], as Selectors Level 3
is already a recommendation). This may rather be part of the [CSS
Pseudo-Elements Module](https://drafts.csswg.org/css-pseudo/).
--
GitHub Notification of comment by SebastianZ
Please view or discuss this issue at
https://github.com/w3c/csswg-drafts/issues/588#issuecomment-254424508
using your GitHub account
Received on Tuesday, 18 October 2016 07:06:39 UTC