Skip Navigation

[Resolved] Reduce gap between grid cell, reduce gap between custom fileds

This support ticket is created 4 years, 6 months ago. There's a good chance that you are reading advice that it now obsolete.

This is the technical support forum for Toolset - a suite of plugins for developing WordPress sites without writing PHP.

Everyone can read this forum, but only Toolset clients can post in it. Toolset support works 6 days per week, 19 hours per day.

Sun Mon Tue Wed Thu Fri Sat
8:00 – 12:00 8:00 – 12:00 8:00 – 12:00 8:00 – 12:00 8:00 – 12:00 - -
13:00 – 17:00 13:00 – 17:00 13:00 – 17:00 13:00 – 17:00 13:00 – 17:00 - -

Supporter timezone: America/New_York (GMT-04:00)

This topic contains 5 replies, has 2 voices.

Last updated by WeiS2074 4 years, 5 months ago.

Assisted by: Christian Cox.

Author
Posts
#1672077
Capture8.JPG
Capture7.JPG
Capture6.JPG

The picture shows 2 custom fields, first is the 6 cell grid, the underneath is a single field wrapped in a container.
How can I reduce gap (white space) between the grid cell, reduce the gap between custom fields?

#1672569

Hello, sometimes it depends on the theme and other plugins. May I see this on the front-end of your site? I can examine the styles applied to this area.

#1672765

hidden link, if you want to login my site please provide a private message form.

#1673609

It seems I need a login to see the issue, so I have activated private reply fields here.

#1675663
Screen Shot 2020-06-24 at 6.10.19 PM.png
Screen Shot 2020-06-24 at 6.10.10 PM.png

Okay I checked the styles applied to these elements, and it seems your theme applies a 1.5em margin to the bottom of paragraph tags. The content of each grid cell is wrapped in a paragraph tag, so those margins are automatically applied by the theme. I have attached some screenshots here showing the margin highlighted in yellow, and an example showing what happens if you set that margin to be 0. To do that, you must override the styles applied by your theme by adding some CSS in your Content Template. In the Block Editor's Document tab, there is a CSS editor panel. Add some CSS code like this:

.views-template-template-for-unwraps .entry-content p {
  margin-bottom: 0em;
}

Adjust the 0em measurement to achieve whatever bottom margin you want under paragraphs. For example, 0.2em would maintain a small margin.

#1688017

My issue is resolved now. Thank you!