Pointless scrollbar appearing on short-enough sidebar

[Gouvernathor]

As you can see, a scrollbar is generated even though the sidebar's contents is short enough not to need one. Also, scrolling that scrollbar actually works, so there is too much whitespace in that sidebar for no good reason, and that's probably causing the scrollbar to appear in the first place.

[Gouvernathor]

This doesn't happen on the doc of the theme. To fix this issue, you just have to add the following in the generated HTML, inside the <div id="rt-footer-container"> : <span class="fa"></span> That's how the theme doc does it (with other divs wrapping it and something inside the span of course), and the fix also works using a div as long as its class is "fa".

I don't know how to make my project insert that on every page though, and in any case the scrolling should not happen when not needed.

It also works if you delete the <div id="rt-footer-container"> entirely. Maybe there is a way for me to make it not generate one ?

[avivajpeyi]

Hey @Gouvernathor -- did you find a cleaner fix to this?

Maybe something can be added to a custom.css?

[Gouvernathor]

Nope, still hanging around with that useless scrollbar. I know almost nothing about CSS.

[pradyunsg]

Got a link to a page demonstrating the issue?

[Gouvernathor]

https://s3.seedboxws.com/ddl/usr00218/Senna/index.html Enjoy the free constitution.

[thtrummer]

CSS Workaround:

.bd-sidebar-primary div#rtd-footer-container {
    bottom:-1rem;
    margin:-1rem;
    position:fixed;
}

[ebolyen]

Ran into this also. I found that it seems to be the negative top margin (at least on Firefox) which causes the miscalculation on the total height.

If the CSS was more specific on the margin (margin-bottom: -1rem) I suspect the goal of escaping the sidebar padding would be achieved while allowing the flexbox to work normally (so long as you can tolerate the default gap from flex between the footer and injected ads).

_static/custom.css

#rtd-footer-container {
    margin-top: 0px !important;
}

[mikegerber]

We also ran into this and used the CSS workaround by @ebolyen.

[sirex]

Same here, and for me following worked (inspired by @ebolyen):

#rtd-footer-container {
    margin-top: 0px !important;
    margin-bottom: 0px !important;
}

For some reason, I also needed to add margin-bottom.