[Support request] Uneven space between blog post blocks on my home page

Home Forums Support [Support request] Uneven space between blog post blocks on my home page

Home Forums Support Uneven space between blog post blocks on my home page

Viewing 15 posts - 1 through 15 (of 15 total)
  • Author
    Posts
  • #1556585
    Lars Ugleberg

    Hello! I am using my blog page as my home page at https://ugleberg.dk and notice that when ever I open my home page, the blocks that show the excerpt from each blog post are not spaced evenly. The last block in each column has double the space. When I refresh the page, the blocks get the correct spacing. That must be a glitch in the login that add space between the blocks, right?

    Best regards,
    Lars

    #1556987
    Leo
    Staff
    Customer Support

    Hi there,

    Any chance you can disable all plugins except GP Premium to eliminate conflicts from other plugins first?

    Let me know ๐Ÿ™‚

    #1557849
    Lars Ugleberg

    Hi Leo, I have now disabled all plugins except GP Premium, and the spacing is still off between the last and next last posts in each column in my masonry based blog page.

    I’ll leave them all disabled until I hear from you again, in case you want to take a new look at the rendered HTML.

    URL: https://ugleberg.dk/

    Best regards,
    Lars

    #1558923
    Tom
    Lead Developer
    Lead Developer

    This is a strange one – it works once I hard refresh a couple of times. It’s like masonry is having trouble calculating the spacing correctly, which is really shouldn’t.

    Any custom CSS/functions on the site at all?

    #1559134
    Lars Ugleberg

    Hi Tom,

    Yes, I have added some CSS:

    .widget ul {
    margin: 0 0 0 1em;
    }

    .widget ul li {
    list-style-type: disc;
    }

    ul {
    margin: 0 0 1em 1em;
    }

    .separate-containers .site-main>.generate-columns-container {
    margin-bottom: -20px;
    }

    .is-style-regular tr {
    vertical-align: top;
    }

    .table235 tr {
    vertical-align: top;
    }
    .table235 th:nth-child(1) {
    width:20%;
    }
    .table235 th:nth-child(2) {
    width:30%;
    }
    .table235 th:nth-child(3) {
    width:50%;
    }

    .table1432 tr {
    vertical-align: top;
    }
    .table1432 th:nth-child(1) {
    width:10%;
    }
    .table1432 th:nth-child(2) {
    width:40%;
    }
    .table1432 th:nth-child(3) {
    width:25%;
    }
    .table1432 th:nth-child(4) {
    width:25%;
    }

    .table2422 tr {
    vertical-align: top;
    }
    .table2422 th:nth-child(1) {
    width:20%;
    }
    .table2422 th:nth-child(2) {
    width:50%;
    }
    .table2422 th:nth-child(3) {
    width:15%;
    }
    .table2422 th:nth-child(4) {
    width:15%;
    }

    #1559149
    Lars Ugleberg

    I just tried to remove all my custom CSS. But the blocks are still unevenly spaced, so I think it isn’t caused by the CSS…

    #1559378
    Leo
    Staff
    Customer Support

    Hmm is the CSS removed currently?

    Any custom PHP functions at all?

    Anything in hook elements?

    #1559740
    Lars Ugleberg

    Hi Leo,

    No, I just removed my CSS temporarily, to see if it might solve the uneven spacing, but it didn’t so I put it back in place.

    I have also activated all my plugins after having left them deactivated for 24 hours to give you guys a window to see how GeneretePress + GP Premium renders the masonry layout without interference from any other plugins.

    But I couldn’t leave all my plugins deactivated beyond the 24 hours as they needed to make my page structure and sidebar widgets work.

    I had hoped you’d see something fairly quickly, once you looked, but I prefer to just live with the uneven spacing – my few and irregular visitors probably won’t notice, so it’s better that content and navigation structure works.

    End I don’t have the elements feature activated at all. Thanks for taking a look, and don’t spend more tome on this on my account – let’s see if it disappears over the course of future updates to GP or WP itself.

    Best regards,
    Lars

    #1560207
    Lars Ugleberg

    Additional information: I tried to change alignment from Blocks to Text, which appeared to render the excerpts accurately (with even spacing). As soon as I switched back to Block alignment on the Blog page, the blocks were again unevenly spaced.

    Unfortunately, I feel I have to stick with Block alignment, since it looks better – in spite of the seemingly random spacing of the blocks.

    Best regards,
    Lars

    #1561563
    Leo
    Staff
    Customer Support

    Additional information: I tried to change alignment from Blocks to Text, which appeared to render the excerpts accurately (with even spacing). As soon as I switched back to Block alignment on the Blog page, the blocks were again unevenly spaced.

    Thanks for this. I’ll try to replicate the issue and report back ๐Ÿ™‚

    #1562093
    Tom
    Lead Developer
    Lead Developer

    I wonder if it’s something to do with the Container Width, what happens if you increase/decrease it in Customize > Layout > Container?

    #1562147
    Lars Ugleberg

    I have tried different widths. No particular width seems to solve the problem.

    #1564289
    Tom
    Lead Developer
    Lead Developer

    I’ve tried to replicate the issue here with no luck: https://tomusborne.com/dev/

    Can you try changing to our Flexbox system?: https://docs.generatepress.com/article/switching-from-floats-to-flexbox/

    I wasn’t able to replicate on Floats either, but it’s worth a shot.

    #1564319
    Lars Ugleberg

    Hi Tom, I have now changed to flexbox, but still see the uneven spacing. But since flexbox sounds like the better and more modern choice, I’ll leave it in that setting.

    Please let me know if it might help if I create an admin user account for you, to log in and see if anything stands out – I don’t have any sensitive data anywhere.

    At some point I might to set up a clean GP-based subdomain to see if it exhibits uneven spacing there as well.

    Best regards,
    Lars

    #1566179
    Tom
    Lead Developer
    Lead Developer

    That would be great if possible – things like this are difficult to figure out if we’re not able to reproduce them. I’d be interested in knowing whether you can get the same thing to happen on a new site.

    Thanks!

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