Skip to content

Instantly share code, notes, and snippets.



Created Jan 18, 2019
What would you like to do?
Safari bug with CSS Grid, display: contents & ::before/::after
<div class="grid">
<div class="replaced"></div>
<span class="green"></span>
<span class="red"></span>
.grid {
display: grid;
grid-template-columns: repeat(4, 150px);
.replaced {
display: contents;
.replaced::before, .replaced::after, .green, .red {
content: "";
width: 100px;
height: 100px;
.replaced::before, .green {
background-color: green;
.replaced::after, .red {
background-color: red;
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment