Are you a GenerateCustomer?

Do you have an active GP Premium or GenerateBlocks Pro license key?

Create a GenerateSupport account for GeneratePress and GenerateBlocks support in one dedicated place.

Create an account
Already have a GenerateSupport account? Login

Just browsing?

Feel free to browse the forums. Support for our free versions is provided on WordPress.org (GeneratePress, GenerateBlocks).

Want to become a premium user? Learn more below.

How to reduce row-gap globally?

  • Hi everyone,
    I have a site that has lots of documents to access.
    I’m using the query block to display them.
    I noticed that the gap between the rows is defaulting to 20px

    .gb-grid-wrapper-c9bb1323 {
        row-gap: 20px;
    }

    But that is specifically for one grid wrapper, how can I make the gap reduced globally ?
    I need to make the row-gap: 10px or smaller globally!
    TIA, Dave
    ps – example page linked below!

  • Hi Dave,

    There is a filter to set the default gap for the Grid block but unfortunately, this will only apply to blocks added afterward. The current blocks will not be affected.

    In this situation, I think you’ll have to create a single global class to set the row gap to 10px or something similar, and then add the class to every block that needs this value in the Advanced > Additional Class(es) field.

  • OK, might be best to wait for the full release of 1.7 & 1.9 ?
    And if I did try it now what CSS is required to set it for that class ?
    Thanks for getting back!
    Dave

  • You can add this CSS to customizer:

    .global-gb-grid-wrapper-gap { 
       row-gap: 10px; 
    }

    Next, select the Grid block where you want to apply this gap setting. In the block editor, go to the Advanced tab in the block settings and add the class global-gb-grid-wrapper-gap to the ADDITIONAL CLASS(ES) field.

  • Great, thanks so much!
    Dave

  • You’re welcome!

Viewing 6 posts - 1 through 6 (of 6 total)
  • You must be logged in to reply to this topic.