Modify size/margin of the main page container?

Hi all,

Is it possible to change the size of the main page container (for example, top margin, width, and side margin)? I’m extremely disappointed that being unable to eliminate the large top margin on my pages:

That is, there is this massive margin at the top that does not go away; is there a way to eliminate it?

I have previously (and successfully) used:

        .reportview-container .main .block-container{{
        max-width: {percentage_width_main}%;
        padding-top: {1}rem;
        padding-right: {1}rem;
        padding-left: {1}rem;
        padding-bottom: {1}rem;

        .uploadedFile {{display: none}}
        footer {{visibility: hidden;}}

with st.markdown(unsafe_allow_html=True) which somehow stopped working at certain point, presumably as a result of a version update. I’d like to ask for help with an updated solution and would appreciate any responses.

Best, Don

Hi Don,
I found a solution changed reportview-container by appview-container. In my case, I just adjusted the padding-top as follow:

.appview-container .main .block-container{{
        padding-top: {padding_top}rem;    }}

Hi mcperez2,

Many thanks, mcperez2. Your solution worked so great!


This topic was automatically closed 365 days after the last reply. New replies are no longer allowed.