How to replace 60% of Bootstrap:
body {
max-width: 1100px;
margin: 12px auto;
}
.thing {
display: grid;
grid-template-columns:
repeat(
auto-fill,
minmax(300px, 1fr)
);
grid-gap: 13px;
}
That should be a responsive 3 column layout on full screen. 2 Columns on smaller screens and 1 column on mobile
@cypnk ... Impossible!
@cypnk Was joking, yeah I agree bootstrap is mostly bloat
@mary Try it ;)
If you follow this pattern, it should work:
<div class="thing">
<article>Stuff</article>
<article>Stuff</article>
<article>Stuff</article>
etc...
</div>