Title: Extra space between header blocks Last modified: September 29, 2021 --- # Extra space between header blocks * Resolved [Haldan](https://wordpress.org/support/users/hblecher/) * (@hblecher) * [4 years, 7 months ago](https://wordpress.org/support/topic/extra-space-between-header-blocks/) * Hi there, * I’m having an issue where the top column set in the header, which includes the site logo, and the menu (placed right beneath the column set), have a lot of extra space in them. None of the blocks have padding, and there are no spacers being used, so I can’t figure out how else to reduce the space between them. * I tried adding an additional css class (m0) that sets top and bottom margins at 0, at the suggestion of commenters on the Twenty Twenty support forum, and then assigning that custom class to the relevant blocks, but no luck there. Any insight about how I might reduce the space between the logo and the menu? * Thanks. * The page I need help with: _[[log in](https://login.wordpress.org/?redirect_to=https%3A%2F%2Fwordpress.org%2Fsupport%2Ftopic%2Fextra-space-between-header-blocks%2F%3Foutput_format%3Dmd&locale=en_US) to see the link]_ Viewing 15 replies - 1 through 15 (of 15 total) * Theme Author [Anders Norén](https://wordpress.org/support/users/anlino/) * (@anlino) * [4 years, 7 months ago](https://wordpress.org/support/topic/extra-space-between-header-blocks/#post-14923015) * Hi [@hblecher](https://wordpress.org/support/users/hblecher/), * Tove applies default vertical margins to blocks, and unfortunately there’s no intuitive way to modify those margins within the editor interface right now. Tove does include classes that you can add to blocks to remove those margins, though. * The classes are: * ``` no-margin no-margin-horizontal no-margin-vertical no-margin-bottom no-margin-left no-margin-right no-margin-top ``` * Applying the no-margin-bottom class to the columns block wrapping your site logo should do it. * — Anders * Thread Starter [Haldan](https://wordpress.org/support/users/hblecher/) * (@hblecher) * [4 years, 7 months ago](https://wordpress.org/support/topic/extra-space-between-header-blocks/#post-14925301) * Thank you! That definitely helped. Unfortunately, as with so much, it seems to have created a new problem. I also applied the no-margin-bottom class to the navigation block, in an effort to get the social buttons block to move up a bit, and it changed all the spacing between the navigation links. I can’t show you what it used to look like, since I can’t seem to get it to revert, but you’ll notice now that the navigation links are pretty far apart from one another, and I’d like to have them return to how they were previously, which was just closer together. I tried putting them in a column block to squeeze them from the outside, but instead of changing their spacing, it just caused them to shift down to new lines when the outer columns were over a certain percentage of the full width. * The other issue is that the no-margin-bottom class didn’t seem to work on the navigation block, so the social buttons are still quite far down. * I really appreciate the assistance. Thanks again. * Theme Author [Anders Norén](https://wordpress.org/support/users/anlino/) * (@anlino) * [4 years, 7 months ago](https://wordpress.org/support/topic/extra-space-between-header-blocks/#post-14925355) * Hi [@hblecher](https://wordpress.org/support/users/hblecher/), * It looks like the menu items have been set to have a background color, which results in Core applying extra padding to them. If you remove that background color, the menu items should revert to their previous spacing. * Yeah, the navigation block has a vertical margin on a child element (which the custom class is not applied to), so the class can’t be used on those. It’s part of the Tove styles, so I’ll see if I can find a better solution to that in a future update. * A fix for now would be to set the social links block to `no-margin-top`, which will reduce the margin between the navigation and the social links a bit. * — Anders - This reply was modified 4 years, 7 months ago by [Anders Norén](https://wordpress.org/support/users/anlino/). * Thread Starter [Haldan](https://wordpress.org/support/users/hblecher/) * (@hblecher) * [4 years, 7 months ago](https://wordpress.org/support/topic/extra-space-between-header-blocks/#post-14925798) * Wonderful! Thank you, both of those suggestions helped. * Thread Starter [Haldan](https://wordpress.org/support/users/hblecher/) * (@hblecher) * [4 years, 7 months ago](https://wordpress.org/support/topic/extra-space-between-header-blocks/#post-14945835) * Hi Anders, * I noticed what might be a bug that I wanted to bring to your attention. The fix you offered above worked great in chrome, but I’m noticing in Safari that there is no spacing between the navigation links. I tried adding in a background color to see if that would change anything, but safari renders them the same either way. It’s no biggie for me since most of the traffic I get is via chrome, and the nav is still useable in safari this way, but thought it was worth mentioning in case you didn’t know. * Thanks again for all your help. * Thread Starter [Haldan](https://wordpress.org/support/users/hblecher/) * (@hblecher) * [4 years, 7 months ago](https://wordpress.org/support/topic/extra-space-between-header-blocks/#post-14945837) * Oh and I just noticed, the post content margin fix in 0.2.2 doesn’t seem to change anything in Safari either. Maybe this is just a known problem with the way blocks work in Safari, but again, thought I’d mention it. * I’ve also noticed that since 0.2.2 the margin fix I mentioned above no longer seems to work in chrome. Now, whether or not I have a background color on the navigation block, the margins seem to be too wide, and I can’t seem to get the links to sit closer together again (on chrome only. on safari, they’re still extremely close together.) - This reply was modified 4 years, 7 months ago by [Haldan](https://wordpress.org/support/users/hblecher/). Reason: another thing I realized * Theme Author [Anders Norén](https://wordpress.org/support/users/anlino/) * (@anlino) * [4 years, 7 months ago](https://wordpress.org/support/topic/extra-space-between-header-blocks/#post-14946168) * Hi [@hblecher](https://wordpress.org/support/users/hblecher/), * I’d check if you have any caching plugin active – it seems like the site is still serving me old CSS (as in CSS not present in Tove 0.2.2). * — Anders * Thread Starter [Haldan](https://wordpress.org/support/users/hblecher/) * (@hblecher) * [4 years, 7 months ago](https://wordpress.org/support/topic/extra-space-between-header-blocks/#post-14948023) * Hmm, strange. The only cache plugin I’ve got going is what came preinstalled ( WP Super Cache) — but I’ve gone and deleted that cache a few times since the update. Would that plugin cause the navigation margin issue I’m describing? * Theme Author [Anders Norén](https://wordpress.org/support/users/anlino/) * (@anlino) * [4 years, 7 months ago](https://wordpress.org/support/topic/extra-space-between-header-blocks/#post-14949959) * The post content is showing up correctly for me now, so you likely managed to empty the cache. * The Safari issue might be that you are running an older version of Safari that doesn’t support the `gap` CSS property, which the Gutenberg plugin uses for spacing between elements in some blocks (including the navigation block). * Thread Starter [Haldan](https://wordpress.org/support/users/hblecher/) * (@hblecher) * [4 years, 7 months ago](https://wordpress.org/support/topic/extra-space-between-header-blocks/#post-14951677) * Hi Anders, * That makes sense re: the safari issue. I’m not running the most current version. * Re: the post content, yes that is working fine for me too, but the issue I’m still having (which is what I thought you were referring to above) is the spacing of the navigation elements. Since 0.2.2, the navigation elements are again spaced far apart — and the using the background color thing you suggested initially for that problem no longer works (now when I add bg color, it only affects top and bottom margins on the navigation block, but doesn’t change anything about the spacing between the elements). Is there any way I can reduce the spacing on the spacing on the navigation elements to return to how it was pre-0.2.2? * Thanks again. * Theme Author [Anders Norén](https://wordpress.org/support/users/anlino/) * (@anlino) * [4 years, 7 months ago](https://wordpress.org/support/topic/extra-space-between-header-blocks/#post-14955137) * Hi [@hblecher](https://wordpress.org/support/users/hblecher/), * Tove was updated to use the Core spacing in the navigation block, to reduce the complexity of the theme styles. You can modify the Core spacing by adding the following custom CSS: * `.wp-block-navigation .wp-block-page-list, .wp-block-navigation__container { gap: .25em 1em; }` * — Anders * Thread Starter [Haldan](https://wordpress.org/support/users/hblecher/) * (@hblecher) * [4 years, 7 months ago](https://wordpress.org/support/topic/extra-space-between-header-blocks/#post-14964616) * That worked, thanks! Appreciate all the help. * Thread Starter [Haldan](https://wordpress.org/support/users/hblecher/) * (@hblecher) * [4 years, 6 months ago](https://wordpress.org/support/topic/extra-space-between-header-blocks/#post-14996473) * Hi Anders, * Since update 0.4, a new margin issue has popped up for me. In the query loop, the post date now has a large bottom margin, and the post title has large bottom and top margins. The margins don’t seem to be responding to the no-margin-bottom and top additional css. Any suggestions? * Thanks. * UPDATE: Sorry, I figured it out. The change seems to be that now the spacer blocks have top and bottom margins, where they used to lack that. I added the additional css tags to the spacers, and that has seemed to work. - This reply was modified 4 years, 6 months ago by [Haldan](https://wordpress.org/support/users/hblecher/). * Theme Author [Anders Norén](https://wordpress.org/support/users/anlino/) * (@anlino) * [4 years, 6 months ago](https://wordpress.org/support/topic/extra-space-between-header-blocks/#post-14996672) * Hi [@hblecher](https://wordpress.org/support/users/hblecher/), * Yeah, 0.4 opts-in to the block-gap feature in Gutenberg, which results in Gutenberg applying base margins to most elements. It’s required to support some features in the Site Editor, including gutter control for the Columns block (and presumably future gutter settings for Buttons, Query, etc.). * — Anders * Thread Starter [Haldan](https://wordpress.org/support/users/hblecher/) * (@hblecher) * [4 years, 6 months ago](https://wordpress.org/support/topic/extra-space-between-header-blocks/#post-15030466) * FYI, the above code broke after the most recent update (of either Tove or Gutenberg, I can’t be sure, since I updated at the same time). It no longer recognized ‘ gap’ — seems to now prefer column-gap and row-gap instead. - This reply was modified 4 years, 6 months ago by [Haldan](https://wordpress.org/support/users/hblecher/). Viewing 15 replies - 1 through 15 (of 15 total) The topic ‘Extra space between header blocks’ is closed to new replies. * ![](https://i0.wp.com/themes.svn.wordpress.org/tove/0.8.3/screenshot.png) * Tove * [Support Threads](https://wordpress.org/support/theme/tove/) * [Active Topics](https://wordpress.org/support/theme/tove/active/) * [Unresolved Topics](https://wordpress.org/support/theme/tove/unresolved/) * [Reviews](https://wordpress.org/support/theme/tove/reviews/) * 15 replies * 2 participants * Last reply from: [Haldan](https://wordpress.org/support/users/hblecher/) * Last activity: [4 years, 6 months ago](https://wordpress.org/support/topic/extra-space-between-header-blocks/#post-15030466) * Status: resolved