Never put margin in components

In web development, a component can be used in many scenarios, you never know. When it has a built-in margin and you don't want it, things get awkward. You need to look inside the component to see exactly which margin (margin top? or just margin) you have to override.

When a component never contains margin, there is no surprise, no mental burden. If you need one, add it through props when using the component. (Don't wrap the component with another div simply for the margin; it makes the DOM ugly!)

You might claim, "What if a component is built strictly for a certain composition, e.g. DialogTitle inside Dialog, and the margin is part of the design?" Fair. But if you NEVER use DialogTitle in other places, why not simply embed it in your Dialog component? The beauty of composition is that it offers you freedom, and margin steals that freedom from you.