Hacker News new | ask | show | jobs
by the_other 1629 days ago
You have the same understanding as the OP. The difference is that the OP is working on a component-based framework. In such a framework, it makes sense to declare the rule defining child margins *in* the parent component's code, not in the child's code.
1 comments

But why do it with extra elements? The child should accept a class or possibly styles and the parent decides what those are.

Child directly styles itself with color, font, internal layout, etc

Parent positions child with flex box, grid, margin or absolute positioning. Spacer elements are not needed at all.

I think I see what you’re saying now. You are wondering why have dedicated layout components when you could “simply” get any component to define styles on its children?

You could do it that way too. However, when you reply on your component system to help assemble a UI, the components take on the encapsulation role you’d use rich selectors for in other situations. A layout component performs the same function as a utility css class, but is more idiomatic.

The article is about spacer elements. As in an empty div that takes up space so things next to it get moved into place. I'm arguing that isn't necessary, as css has plenty of tools for laying things out. I have no issue with components that focus on layout, that is fine. A div that uses say flex box to layout a set of children is quite common. I'm arguing that parent div does not need spacer elements, you can always accomplish the layout you need with standard css such as flexbox, grid, margin, etc.