This New CSS Margin Feature Is A Huge Quality Of Life Improvement

🌎 Find Me Here:

#Shorts

[beinyourguard]

the real surprise is it only being supported in safari

[nocentii]

Not sure I'm understanding how the problem wasn't already solvable with the lines below.

.card *:first-child { margin-top: 0 }
.card *:last-child { margin-bottom: 0 }

Or margin-block-start/end if preferred.

This seems more like syntactic sugar than a new feature. A nice addition for brevity, no doubt, but I don't see the problem that was unsolvable before this property was added.

[sharakpl]

Better to reset margins and use grid/flex and gap

[selectorsaurus]

Or make a margin reset and apply margin like this:

* + * { margin-block-start: 1.5em; }

[GuINES-mG]

"No matter what I do I can't change the margin". What? Why you can't change the margin of H and P tags? That is the most stupid thing I have ever heard

[dawidfrankiewicz]

That would be nice. For now i am often using .card > *:first-child and same for last-child, reset margins for those

[tinuts]

what about a simple reset css ? always start a new project with that lol * { margin: 0; padding: 0; }

[hubulikhwan]

what about that blue color in anchor<a>

[stefanomic]

you can always change the margins of everything by selecting the elements appropriately. best thing is to not have the margins where you don't want them in the first place, rather than having to trim it. it will result in ambiguous code otherwise, that resets things that shouldn't be there.

[gregluce]

I’m kind of partial to Tailwind, which takes out the margins of every block element altogether.

[SkyyySi]

Honestly, you should always just reset all CSS properties and define the ones you need yourself. That way, you avoid your website's design breaking down as soon as it hits another browser's default CSS settings.

(Is this a moment to say 'Tailwind FTW'?)

[robyroby]

Still waiting for leading-trim support…

[efeminella]

You can just set the margin attribute as needed for the given elements

[felikowski]

couldn't it just be overwritten with an additional class that gets added on the card div, which overwrites the margins with an !important at the end?

[JammieDragon]

Why not just do *{margin:0;padding:0;}

[BackUp-czzn]

i usually just reset all h1, h2, h3, p.. elements and let tailwind take over.

[muhammadharis]

Securing a job is extremely difficult. Every company has its own set of frameworks and libraries

[Chronologist]

I am very certain that, whenever a new feature is added to CSS or HTML, a webengine developer somewhere in the world offs themselves xD

[Absolute]

I expect a very low probability for this feature to be adopted by other browsers. I hope we don't get these kinds of solutions where we take counter measures against customizable features.

[MasterQuestMaster]

Why use p when you don’t want the margin?