• Support

  • CSS problem with DiscussionPage-nav

Basically what I want to do is to have the DiscussionPage-nav sticky or fixed during scrolling, the only way I've been able to do this without it going beyond the footer or the topic title is with the following code:

@media (min-width: 992px) {
.DiscussionPage-nav, .DiscussionPage-nav>ul {
width: 190px;
position: sticky;
top: 80px;
}
.App {overflow-x: visible;}
}

As you can see in the image but for some reason the first post acquires the height of the DiscussionPag-nav, is there any way to solve it? or even if you know a more efficient way to have this menu locked during the scroll, but without exceeding the limits of the div of the title of the discussion or footer would help me a lot.

  • mekici, ctml, and User31 like this.

  • The culprit ist the following CSS:

    .Post::before, .Post::after {
    content: " ";
    display: table;
}

    If you override any of these rules, your problem disappears.

    However, I don't know the reason for these rules, so I can't promise that revoking them won't have any other negative effects. Offhand, I don't see any.

The culprit ist the following CSS:

.Post::before, .Post::after {
    content: " ";
    display: table;
}

If you override any of these rules, your problem disappears.

However, I don't know the reason for these rules, so I can't promise that revoking them won't have any other negative effects. Offhand, I don't see any.

    Finally! This error had me crazy I tried a thousand possibilities and did not look at the ::before and ::after... after a while of test I do not see any problem using it, here you can see it live https://brickdose.com/d/29-count-to-1-000

    For those who want to use it with a none in the content is enough:
    .Post::before, .Post::after {content:none;}

    Thank you very much Pollux!!

    Edit: This discussion can be marked as solved

        Works great, and solves the problem I've been fighting with of the scrubber going over the footer!

        Does anyone know what the .Post::before, .Post::after { } rules are there for, just to be aware of anything I might be breaking without noticing it?

          Trombert

          Thanks, the scrubber and my footer have been fighting non-stop on my site getting up in each others business for a long time!

          JohnP Thanks for tagging me! I definitely would have missed this, I'm glad our issue is finally solved 🙂

              JohnP I couldn't tell you exactly why it's there, I've looked and it's something that happens in other elements as well, maybe someone here knows the specific reason... it definitely doesn't seem to be anything important after testing it with about +65 extensions.

              Anyway, if in the future I notice that something breaks (core, extensions...) related to this I will post it here 🙂