css-gridish icon indicating copy to clipboard operation
css-gridish copied to clipboard

Margin bottom on last-child

Open j1mie opened this issue 6 years ago • 3 comments

Hi there,

screen shot 2018-04-30 at 15 23 55

This selector seems to be causing some strange behaviour for elements on my site - it looks like it has a high specificity level that's overriding margins on my own components.

Wondering if you have any ideas or suggestions for this?

Cheers!

j1mie avatar Apr 30 '18 14:04 j1mie

This was a fix to solve bottom margin on the last elements in a grid messing everything up. Particularly with default margin bottom on type elements. It tends to be more helpful than destructive. However, the only workaround I know of is !important.

So if you can think of a more graceful way, let me know.

seejamescode avatar Apr 30 '18 18:04 seejamescode

Seeing as you're now using helper classes for grid columns, as well as for the flex fallback, perhaps this fix could be added to those instead? What do you think?

j1mie avatar May 01 '18 10:05 j1mie

What if you use a type element as a grid child though? I think we would need to disable that child’s native margin bottom.

Can you share an example situation from your site? That may help show what we should avoid targeting.

seejamescode avatar May 01 '18 18:05 seejamescode