Archived topic
CSS to reduce the Columns Space
5 replies · Started by purnima banik on December 25, 2019
Hi Tom,
I want to reduce the space between the columns horizontally and also the space in between the next column row vertically. All of the columns on my webpage are created with block editor. Please Suggest the Solution to achieve the desired result. I want to achieve this on this webpage is Here.
Hi there,
You can try some CSS like this:
@media (min-width: 782px) {
.wp-block-column:not(:first-child) {
margin-left: 20px;
}
}
Adding CSS: https://docs.generatepress.com/article/adding-css/
That worked fine to reduce the spaces between the column, but I also wanted to reduce the gap between the row as well, I mean horizontally.
Hi there,
try this CSS:
.wp-block-columns {
margin-bottom: 0 !important;
}
.wp-block-column p {
margin-bottom: 0.5em !important;
}
Thank You, that worked perfectly.
You're welcome