Skip to content

Instantly share code, notes, and snippets.

@sukhikh18
Last active October 10, 2021 20:19
Show Gist options
  • Save sukhikh18/b1d541398634271df004904f9d5629b4 to your computer and use it in GitHub Desktop.
Save sukhikh18/b1d541398634271df004904f9d5629b4 to your computer and use it in GitHub Desktop.
Grid row #Styles
.section {
--columns: 3;
--col-gap: 30px;
--col-gap-half: calc(var(--col-gap) / 2);
&__list {
display: flex;
flex-wrap: wrap;
margin-left: calc(-1 * var(--col-gap-half));
margin-right: calc(-1 * var(--col-gap-half));
}
&__item {
word-wrap: break-word;
margin-left: var(--col-gap-half);
margin-right: var(--col-gap-half);
width: calc((1% * (100 / var(--columns))) - var(--col-gap));
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment