I'm not sure if it's the "right" way to do it, but on my blog site I just applied it at the top level to the body section:
font-family: Arial, Helvetica, sans-serif;
padding: 0 1em;
margin: 0 auto;
grid-template-columns: repeat(3, 1fr);
grid-gap: 0 1.5em;
grid-auto-rows: minmax(auto, auto);
You don't have to support IE? That would be amazing!
Please understand that's a genuine response (and genuine jealousy), not any sort of crappy sarcasm - I wish I could convince my bosses to drop support for IE. I think I've got them set to drop IE10 as of the turn of the year, but 11's probably going to take some more time...
cluelessPHP - When I'm not working in WordPress, personally I try to use <picture> elements in the HTML and media queries in CSS, each where appropriate. With WordPress, just compress the image as best you can that it doesn't look like crap and hope.