Disable scrollbar

Hi all,

Is there a way to disable scrollbar?

I am building an one-page app where the content does not exceed screen height, the scrollbar appears anyways even when there is nothing below the main component.

Iโ€™d really like my page to be fixated. Is there an option to disable the scrollbar?

thanks in advance,
Don

Iโ€™m looking for this too.

I thought you could use the โ€˜overflowโ€™ tag in CSS, but it doesnโ€™t seem to work in Streamlit.

body {
  overflow: hidden; /* Hide scrollbars */
}

I am also looking to display dashboard on entire screen without scroll bar

Did you got the solution, am also looking for this

Also interested in thisโ€ฆ has anyone found a solution?

You can use css to reduce the empty space that is the padding before the footer. Try the at the end of your page:

css = '''
<style>
section.main > div:has(~ footer ) {
    padding-bottom: 5px;
}
</style>
'''
st.markdown(css, unsafe_allow_html=True)
1 Like

I found a solution. At least it works with columns and chat_message.

css = '''
<style>
    [data-testid="ScrollToBottomContainer"] {
        overflow: hidden;
    }
</style>
'''

st.markdown(css, unsafe_allow_html=True)