Closed JABClari closed 5 years ago
The padding values applied to the grid elements are used to set the grid gap (you can overwrite it using one of the .grid-gap-- classes). They work in combo with the negative margins applied to the grid container (which make sure the grid is aligned with other layout elements). If you want to style a grid item, I'd suggest to create a new element inside the .col-- element (and use the grid classes only for setting layout rules). Cheers
More info on the Grid & Layout page of our documentation: https://codyhouse.co/ds/docs/globals/grid-layout
The grid class applies padding which gives a weird result. I don't know the notion behind it. Check it out in the image below.
<div class='grid'>
Computed Result
padding : var(--space-md) 0 0 var(--space-md);
padding-top: var(--space-md); padding-right: 0; padding-bottom: 0; padding-left: var(--space-md);
What's the reason behind the 0 0 on the right and bottom ?