[Resolved] Contain feature image, post title and meta width on a full-width single post

Home Forums Support Contain feature image, post title and meta width on a full-width single post

  • This topic has 5 replies, 2 voices, and was last updated 4 months ago by Leo.
Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #1457264
    George

    Hello. I’ve bumped into an unexpected issue. I have full-width sections on my single posts and using GenerateBlocks. My layout container is 1300px. Since some sections are full-width, the whole container goes full-width as well. I am using GB containers set to 1380px to simulate left and right paddings of 40px. What I have noticed is that the header feature image and post header meta also go full-screen. I managed to solve the issue with some CSS.

    .single-post .inside-article .entry-header, .single-post .inside-article .featured-image {
        max-width: 1380px;
        margin: 0 auto;
        padding-left: 40px;
        padding-right: 40px;
    }
    
    @media (max-width: 768px) {
        .single-post .inside-article .featured-image, .single-post .inside-article .entry-header {
            padding-left: 30px;
            padding-right: 30px;
        }
    }

    It works fine but feels like a hack to me. Am I missing something simple?

    #1457725
    Leo
    Staff
    Customer Support

    Hi George,

    That looks like a good solution to me.

    Can you link me to the page in question so I can see if I can spot anything?

    Let me know πŸ™‚

    #1457760
    George

    It’s a big hassle to do it right now, still developing. I will once I complete the design. I just found it strange that the title, meta and feature image all went full-screen even though it actually makes sense. I would have liked to see some options to contain certain parts of the page, maybe through Layout element even though its content settings won’t change anything, other than containing the whole container again.

    #1458872
    Leo
    Staff
    Customer Support

    The ideal situation down the road would be to implement the title, meta, featured image etc using a block element so everything can be customized this way.

    As for now, I wonder if a workaround of using a contained header element with template tags would help?

    The header element would be excluded from the full-width setting.

    #1459238
    George

    The ideal situation down the road would be to implement the title, meta, featured image etc using a block element so everything can be customized this way.

    That would be ideal!

    As for now, I wonder if a workaround of using a contained header element with template tags would help?

    The header element would be excluded from the full-width setting.

    Hmmm, not a bad idea. Once the template tags are entered in the header element, they are not present on the single post template anymore. In my case, though, the design calls for the meta to be displayed underneath the featured image just as the single post template displays them so I would just rather enter the CSS and be done with. I could use absolute positioning for the placement of the header meta, I guess. Thanks for the pointers, this should prove useful in the future!

    #1459337
    Leo
    Staff
    Customer Support
Viewing 6 posts - 1 through 6 (of 6 total)
  • You must be logged in to reply to this topic.