Weird spacings that pops up on mobile device but not laptop

  • Unknown's avatar

    Hello, I am writing a travel blog itinerary HERE, and everything looks good on my laptop and even when I toggle between tablet and mobile view.

    But when I view it on my mobile device, there are weird extra spacings between some of the blocks.

    I checked the padding and margin of the blocks and they are all 0, so what’s the issue? Thanks in advance.

    The blog I need help with is: (visible only to logged in users)

  • Unknown's avatar

    When layout preview modes look clean in the editor but show extra spacing on an actual mobile device, it is usually caused by theme-level CSS rules or block wrap behavior on smaller screens. Common causes include empty Paragraph blocks lingering between sections, media blocks collapsing into stacked flex layouts with default mobile gap settings, or non-breaking spaces inserted within the text. Try opening the post editor, clicking the List View icon (three stacked lines) at the top left, and checking if there are stray empty blocks hidden between your itinerary elements. If List View is clear, toggling the block’s Dimensions > Block Spacing (Gap) setting or grouping the blocks together can override the theme’s default mobile gaps.

  • Unknown's avatar
    1. List view is clear
    2. I went to Dimensions > Block Spacing > Padding/Margins, but they were all 0 (did I go to the wrong place?)
    3. Grouping all the blocks together solved it :D Thank you!
Log in or create an account to reply