Remove Padding Under Block Grids

Support
#1

I’ve tried to remove the padding, but don’t know why it won’t work.

I have all this code in the CSS.

.x-block-grid.four-up > li {
padding: 0;
margin-bottom: 0 !important;
}

.x-block-grid.four-up > li.x-block-grid .x-img {
padding: 0;
border: 0;
margin-bottom: 0 !important;
}

.x-block-grid > li {
text-align: center;
}

.x-block-grid>li {
/* set 0 to remove the spacing totally */
margin-right: 0;
margin-bottom: 0 !important;
}

.x-block-grid.four-up>li {
width: 25%;
margin-bottom: 0 !important;
}

.x-block-grid.four-up>li:nth-child(4) {
margin-right: 0;
margin-bottom: 0 !important;
}

But none of it removes the black (white) space under the grid blocks.

Any help?

Jesse

#2

i changed width 25% to min-width since mobile looked awful.

#3

For now i added a negative padding to the row and it worked.
But if there’s something else i should do, please let me know.

#4

Hello Jessie,

To resolve your issue, you need to add this custom css:

.x-block-grid,
.x-block-grid > li,
.x-block-grid > li p {
    margin-bottom: 0;
}

Hope this helps.

#6

That kind of worked, i had to mess with gaps, but it looks alright now, thanks

#7

You’re welcome.

#8

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.