[Resolved] Latest Blog post wraps poorly at certain widths

Home Forums Support [Resolved] Latest Blog post wraps poorly at certain widths

Home Forums Support Latest Blog post wraps poorly at certain widths

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #2218868
    Gerald

    My blog archives are setup to display posts in two columns. However, I have set up a full-width first blog post element for my archive pages, including the front page. At most resolutions, this works really well. However, if the window width ranges from 770 to 1024 pixels, the element does not clear properly. Instead, the second blog post is squeezed to the right of the top post. This looks very ugly.

    I tried adding a Custom CSS class “clear: both !important;” but that didn’t do the trick either. Do you have an idea how I can fix this? It’s probably something really dumb.

    I use GenerateBlocks Premium and GeneratePress Premium in the latest versions.

    At this point, I’m uncertain whether this is a GenerateBlocks or GeneratePress issue. The issue is not noticeable on most smartphones or tablets, but some high-res tablets display my pages at exactly the width which causes the layout to break.

    #2218871
    Ying
    Staff
    Customer Support

    Hi Gerald,

    Try add this CSS:

    @media (min-width: 768px) and (max-width: 1024px) {
        .blog article.post:first-child, .archive article.post:first-child {
            width:100%;   
        }
    }
    #2218902
    Gerald

    Problem solved! Thank you!

    #2218978
    Ying
    Staff
    Customer Support

    You are welcome 🙂

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