Mmmm nope. Margins and padding are hugely important for web usability and accessibility.
Use spacer components instead of CSS margins (2020)
11–20 of 230 posts
Re: Use spacer components instead of CSS margins (2020)
#12The point about not having it in a component is valid. It happens all the time that a margin on a component is different based on context. But there is no need to make it any more complicated than a margin -- just add the margin externally and if your framework can't do that, add a wrapper and put the margin there.
Re: Use spacer components instead of CSS margins (2020)
#13Margin is generally more desirable than padding imo. Component/element knows the content it contains and uses margins to require a minimum amount of spacing. It avoids the need to make decisions on the spacing between every combination of components.
Padding only works if you know everywhere your component might be used or don't mind remaking spacing decisions every time you use it. In my experience minimizing code needed for each use of a component leads to more coherently styled interfaces, particularly on larger or faster moving teams.
Re: Use spacer components instead of CSS margins (2020)
#14Flutter does this, and its layout model is quite well thought.
Re: Use spacer components instead of CSS margins (2020)
#15Re: Use spacer components instead of CSS margins (2020)
#16I understand and agree with the sentiment expressed here regarding the outer layout of components in a page (though I'd actually recommend using `gap` with a flex or grid layout).
But margins can be incredibly helpful when implementing internals of complex components, and when laying out components next to each other that are not equal peers (like labels with form fields).
Negative margins can also be very helpful in some circumstances, like when a border shouldn't contribute to the space taken by a component, or when components should overlap without resorting to absolute or relative positioning.
Re: Use spacer components instead of CSS margins (2020)
#17"A programmer does CSS"
Rules without margins are going to be a mess. For one you can't negative margin the padding out of the first titles in a section and other useful negative margin pulls.
Without margin collapse, you're going to need to handle first and last paragraph so they don't have half margin from their container.
Margins are respected across the elements hierarchy, which is especially useful if you're reusing components in react like systems; neither nested paddings nor grids aren't suitable do that.
Re: Use spacer components instead of CSS margins (2020)
#18This is a great pattern. How does margins work in SwiftUI ?
Re: Use spacer components instead of CSS margins (2020)
#19Needs (2020) in the title. Original discussion, 123 comments:
https://news.ycombinator.com/item?id=22676442
Anyway, considered harmful articles considered harmful.
There is a time and place for margins. Being thoughtful with them is a better approach than "banning margin from all components."
Should I really ban the use of `margin-left: auto` when positioning my flexed elements? I don't think this article is actually advocating for that, but a novice reader may.
Re: Use spacer components instead of CSS margins (2020)
#20[flagged]