DEV Community

Discussion on: Things I Wish I’d Known About CSS

 
perpetual_education profile image
perpetual . education

and I guess - to add to that, sometimes we're working with 'event' type lists / and there might be a headliner band... and 1 or 4 support bands, and a DJ - and a special note about the costs, and all ages or not, - and so the markup is always on the fly. In those cases there isn't necessarily space between each of those - so, that's another reason why we use the + with so much specificity. It's complex at first / but then it just works and can handle anything we throw at it. So, that's another edge on that case. Same might be if your headings had padding and background colors.

Thread Thread
 
websmyth profile image
Dave Smyth

My general approach is to set the general spacing then define exceptions, so it might be something like:

article > * + * {
  margin-top: 1em;
}
* + h2,
* + h3 {
  margin-top: 2em;
}

...etc. I write exceptions often, but I reckon it’s still fewer than if I wrote each margin. There are other benefits to this approach, though, particularly when trying to make CMS blocks that are interchangeable.

It’s also really useful for horizontal lists, but I guess you might already use it for that. :)