reduce space between blocks

  • There is no intuitive way to reduce the space between all the blocks. I thought WP was wysiwig? Am I missing a feature with 2020?

    How do I reduce the space between the image and the headline link?
    How do I reduce the space between the headline link and the “Dedlock” image?
    How do I reduce the space between the “Dedlock” image and the three columns below?

    Thank you.

    The page I need help with: [log in to see the link]

Viewing 15 replies - 1 through 15 (of 21 total)

  • In the Customizer (Appearance -> Customize), under Additional CSS write this code:
    .m0 {margin-top:0; margin-bottom:0}
    Then go to your block that you want to eliminate top and bottom spacing. Under Advanced panel on the right side enter in Additional CSS Class(es) input: m0.

    If there isn’t any change try to put m0 class in neighbouring block up or down.

    When space is eliminated, you can use Spacer block to make custom spacing.

    This works for other pages but doesn’t work on our homepage. https://www.TotalLifeEnergyPlan.com Thank you.

    Thread Starter rollout

    (@rollout)

    Hi,
    I did that and it didn’t seem to move the blocks much.

    @rollout try this: Change Additional CSS in customizer to:

    .m0 {
    margin-top: 0!important;
    margin-bottom: 0!important;
}

    This should do the trick.

    @juliahsun I can’t find .m0 on any block on your frontpage. On what block do you want to reduce margin?

    I added it in many blocks on our frontpage but removed it after it didn’t do anything. Now I put it back in with added !important and it works very well. Thank you very much, @mihaomejc!

    Any update on this? I too find the amount of space way too much. I went with this theme because it was the newest and “latest and greatest”. I am not married to it, but if I change the number of choices is simply overwhelming.

    Moderator James Huff

    (@macmanx)

    Per the reply above yours it sounds like https://www.ads-software.com/support/topic/reduce-space-between-blocks/#post-12238102 works.

    With that said, there is no requirement to use Twenty Twenty. If the theme requires too many customizations to fit what you need, there are thousands to choose from: https://www.ads-software.com/themes/browse/new/ ??

    Hi miha, your explanation is great but I cant get my blocks to budge at all. I am in the new GoDaddy Go theme and we really like the look but blocks have about 1 1/2 inches betwwen top and bottom. I’ve tried both your global css adds and adds on the blocks themselves but cant get them to move! Your help is appreciated if you have a moment. thank you

    Moderator James Huff

    (@macmanx)

    @nicoray This support forum is for the Twenty Twenty theme https://www.ads-software.com/themes/twentytwenty/ which is why Miha’s suggestion didn’t work for you.

    You can find support for your theme at https://www.ads-software.com/support/theme/go/

    None of the suggestions on this page are working on our website. I just opened the twenty twenty theme and the spaces between the website title, the upper nav bar, and the header image is flippin’ huge.
    I can’t implement the block fix because the header isn’t in a block, that I can see.
    https://lindaerlam.com

    Hi community
    I am an absolute beginner with web design and don’t know anything about css classes. I’m trying use the Gutenberg Editor in the Sydney theme and I’ve inserted 2 blocks with the visual editor and found that there is quite a big distance between the two blocks. Now I’ve found this thread and have costumized my site as described above. But if I want to go to the block and go to the “Advanced panel on the right side” to enter in Additional CSS Class(es) input: m0 I don’t find any “Advanced panel”.

    Does “go to the block” mean that I have to klick on the edit button and then add under CSS declarations .m0 or m0? I’ve tried both, but nothing has changed. What do I wrong?

    I have seen that the thread is for Twenty Twenty and I’m using Sydney. Is it possible that your suggestion doesn’t work for this theme?

    Best regards
    pebi1

    Hi
    In the mean time I’ve found out that I have to set in the Edit Row mode Row Styles/Layout the top margin to 0.
    Sorry for such stupid questions.
    Regards
    pebi1

    Moderator James Huff

    (@macmanx)

    I have seen that the thread is for Twenty Twenty and I’m using Sydney.

    You are correct. I recommend asking at https://www.ads-software.com/support/theme/sydney/ so your theme’s developers and support community can help you with this.

    Hello. I’m using Twenty Twenty theme and I’m having the same issue. Made the header and main page, they seem great. But the “About me” and “Contact” pages have awfully large space from the headline title to the block in the page. The “About me” page is even worse… I see the contents ok in the block editor, but when viewing the final result in the browser, its a whole bunch of white I can’t know where it comes from… Any tips? Tried the coded Miha provided in this thread but made no changes.

    Site is: https://rita-vidigal.pt
    Contact = Contactos
    About me = Sobre mim

    • This reply was modified 4 years, 4 months ago by msdesignfoto.
Viewing 15 replies - 1 through 15 (of 21 total)
  • The topic ‘reduce space between blocks’ is closed to new replies.