Why the weird margin-right and padding-right on Gutenberg columns

  • Hi,

    While I know Storefront is not meant to be a block-based theme, I’m trying to move some pages to the block-based editor, for flexibility, but I come across what I think are very weird margin-right and padding-right rules on columns.

    Before I start overriding this with CSS (and this is not my question, because I know how to override it), I’m wondering what’s the reason for these rules? What am I missing? They seem to me so odd, that I’m probably missing something.

    From 600px to 781px wide, there’s a 5.88…% padding-right on “non even” columns: https://snipboard.io/c7woSX.jpg & https://snipboard.io/st905L.jpg

    From 782px up there’s a 5.88…% margin-right on “non last-child” columns: https://snipboard.io/nq1xHm.jpg

    Again, I can fix this with custom CSS, but I’m wondering the reasoning behind this.

Viewing 3 replies - 1 through 3 (of 3 total)

  • Hello Marco Almeida

    Thank you for contacting us.

    I understand you are enquiring about padding and margin on the right side of the elements.

    These spacings are added to create a gap between elements and it goes in line with the overall design of the StroreFront theme.

    However, after reviewing your screenshots it looks like these gaps do look a bit odd, specifically 600px to 781px width.

    Could you please share a link to your website?
    I want to inspect the elements from my end and review the gaps.
    I can do this on my test site too but since your site is well populated, it will be a better choice.

    I look forward to your response. ??

    Best regards.

    The page is not published. We’re trying to move the homepage from the classic editor to Gutenberg for now.

    Can you replicate the 600px to 781px width issue? Just create a 2 columns block and insert a big image on each column.

    Hmm I get different results, when testing per your last message here, @webdados.

    Below, I am attaching a screenshot, for reference.

    About 4,35%, in my testing. Direct link to image: https://snipboard.io/sqSDQP.jpg

    I hope this is helpful! Please let us know if you have any further questions or concerns.
    We will be happy to help you further.

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Why the weird margin-right and padding-right on Gutenberg columns’ is closed to new replies.