foundation-apps icon indicating copy to clipboard operation
foundation-apps copied to clipboard

Recursive Grid Block Padding

Open nk2580 opened this issue 8 years ago • 0 comments

Hello,

it appears as though the following compiled Style is inherited for all grid blocks within a grid content element

.grid-content .grid-block {
    margin-left: -1rem;
    margin-right: -1rem;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    overflow: visible;
}

the padding is applied recursively to all grid blocks regardless of their parent when the parent to their containing grid block is a grid container which causes the blocks subsequent width to be larger than the container and when applied recursively this makes the total width of contained grid blocks wider than the browser window.

this could be fixed by adding the following somewhere to the foundation SCSS files

.grid-block .grid-block {
    margin-left: 0;
    margin-right: 0;
}

does anyone know where to add this in to resolve the issue

nk2580 avatar Feb 12 '16 04:02 nk2580