Reduce white space top of the page

🎈 Using Streamlit
1

I find the white space on the top of the page of streamlit apps a bit too much, is there any way I can reduce the white space? Thanks!

1 Like
2

Hi @Philip_Oosterholt , this seems to have been answered in

Cheers

3

Thanks, the solution didnt work but I managed to change the properties with some tweaking:

# Remove whitespace from the top of the page and sidebar
st.markdown("""
        <style>
               .css-18e3th9 {
                    padding-top: 0rem;
                    padding-bottom: 10rem;
                    padding-left: 5rem;
                    padding-right: 5rem;
                }
               .css-1d391kg {
                    padding-top: 3.5rem;
                    padding-right: 1rem;
                    padding-bottom: 3.5rem;
                    padding-left: 1rem;
                }
        </style>
        """, unsafe_allow_html=True)
6 Likes
4

The code seems to be working locally but not on streamlit cloud. Kindly find some other solution

2 Likes
5

Has anyone found a recent fix for this?

3 Likes
6 
st.markdown("""
        <style>
               .block-container {
                    padding-top: 1rem;
                    padding-bottom: 0rem;
                    padding-left: 5rem;
                    padding-right: 5rem;
                }
        </style>
        """, unsafe_allow_html=True)

This is working for me on AWS. It will probably work in streamlit cloud too!! You can change the numbers of rem in the padding to your liking.

6 Likes
7

thanks, this works for me.