Design series – centering
The whole blog is glued to the left side of the browser window, we can give it some breathing room by centering the body element.
In _layouts/default.html.
…
<body class="center">
…
In _sass_/minima.scss:
.center {
box-sizing: content-box;
max-inline-size: var(--measure);
margin-inline: auto;
padding-inline-start: var(--norm-size);
padding-inline-end: var(--norm-size);
}
Result
And this is how it looks after applying those styles:
