[Support request] Topic and early replies hidden in bbpress when jumping to last post

Home Forums Support [Support request] Topic and early replies hidden in bbpress when jumping to last post

Home Forums Support Topic and early replies hidden in bbpress when jumping to last post

Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • #1653827
    Mike

    I’m suffering an annoying issue with bbpress on my site https://oysterfares.com. If I click on the link for the latest post in a topic (it’s the time since posting in the final column on the latest posts table on the homepage) then it takes me to the topic but everything before the latest post is hidden. If I view page source then it’s all there but there’s no way to scroll up the topic unless you take the /#post-720 off the url and reload the page.

    I looked in bbpress support and they suggested switching theme to a bundled one (twenty twenty-one in my case). When I did this the problem went away. The page displayed at the position of the last post but you could scroll up through the earlier posts.

    It appears to be an issue where the url ends with #something. Do you have any ideas?

    #1654308
    David
    Staff
    Customer Support

    Hi there,

    this CSS in your Simple CSS is creating the issue:

    div#page {
        background-color: #ffffff;
        overflow: hidden;
    }

    If you remove the overflow hidden property then you will see the entire page.

    #1654790
    Mike

    Thank you David,

    The problem is that that CSS is handling making the sidebar(s) stretch down the full length of the page as per:

    div#page {
        background-color: #ffffff;
        overflow: hidden;
    }
    div#right-sidebar, div#left-sidebar {
        margin-bottom: -99999px;
        padding-bottom: 99999px;
        background-color: #c0c8ea;
    }
    

    Do you have any other ideas how to achieve one without the other side effect?

    #1655140
    Ying
    Staff
    Customer Support

    Hi Mike,

    Remove the overflow:hidden;
    And try this CSS to extend the sidebar:

    .site-content, #right-sidebar {
        display: flex;
    }
    #right-sidebar .inside-right-sidebar {
        display: flex;
        flex-direction: column;
    }
    #right-sidebar .widget:last-child {
        flex: 1;
    }

    Let me know πŸ™‚

    #1655211
    Mike

    Hi Ying,

    It’s almost there. The sidebars stretch to the full column depth, but the widths are different. The right sidebar escapes the overall page width by about 10px. I’ll leave it with your code on while I try and read up a bit about flex.

    Thanks for your help so far. πŸ™‚

    #1656157
    Ying
    Staff
    Customer Support

    You are welcome Mike, you could add this CSS:

    .inside-right-sidebar {
        max-width: 100%;
    }

    Let me know how it goes.

    #1656422
    Mike

    Hi Ying,

    That sorted it, thanks. At least for the 20-60-20 displays on laptops/tablets. I’m terribly sorry to notice too late that on mobiles it’s now trying to display all three sections next to each other rather than the 60 (main content) first and each of the 20’s (sidebars) underneath. I have a horrible feeling that I’m trying to push GP beyond where it’s designed to go, so please do say so if that is the case.

    I really appreciate your assistance to date.
    Mike.

    #1656429
    Ying
    Staff
    Customer Support

    No worries, we try our best to help πŸ™‚

    Give this a try:

    @media (max-width: 768px) {
        .site-content {
           flex-direction: column;
        }
    }
    #1656449
    Mike

    Thanks! I actually just tried adding “flex-wrap: wrap” to the .site-content class and that seems to do what I want. Thanks once again for all your help.

    #1657199
    Ying
    Staff
    Customer Support

    Nice!
    Glad you figured it out πŸ™‚

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