By way of a post by Manuel Matuzović which is by way of a demo by Temani Afif.
.wrapper {
margin-inline: max(0px, ((100% - 64rem) / 2));
}You’d be doing yourself a favor to read Manuel’s breakdown of …
There’s all kinds of ways to do that. Some more advisable and better-suited for certain situations than others, of course.…
I think this is good advice from Silvestar Bistrović:
An enabling selector is what I call a selector that does a job without disabling the particular rule.
The classic example is applying margin to everything, only to have to remove …
The margin-inline-end property in CSS defines the amount of space along the outer ending edge of an element in the inline direction. It’s included in the CSS Logical Properties Level 1 specification, which is currently in Working Draft.…
The margin-inline-start property in CSS defines the amount of space along the outer starting edge of an element in the inline direction. It’s included in the CSS Logical Properties Level 1 specification, which is currently in Working Draft.…
Josh Comeau covers the concept of margin collapsing:
…This idea might sound simple, but if you’ve been writing CSS for a while, you’ve almost certainly been surprised when margins either don’t collapse, or they collapse in weird and unexpected ways.
Going with that title instead of the classic developer clickbait version Max used. ;)
We should ban margin from our components.
Don’t use margin?! This thing I’ve been doing my entire career and don’t have any particular problems with?!…
PPK digs into the subject, which he found woefully undercovered in web tech documentation. Our entry doesn’t mention them at all, which I’ll aim to fix.
Agree on this situation:
…This is by far the most common use case
Robin has covered this before, but I’ve heard some confusion about it in the past few weeks and saw another person take a stab at explaining it, and I wanted to join the party. …
In front-end development, there are often times when I know that I don’t know something. I might know enough to know what CSS to search for, but I have absolutely no idea how to use it or what the right …
Here’s a one-sentence blog post about margin collapsing: When two block elements are stacked on top of one another, the vertical space between them is the larger between the one on top’s margin-bottom and the one on the bottom’s margin-top…
