How to modify st.sidebar function?

Summary

I think the st.sidebar is too widely, I wonder how to fix it. and once you use sidebar, the button “>” is too small to use, especially on a mobile phone with my webapp.

Steps to reproduce

Code snippet:

add code here

If applicable, please provide the steps we should take to reproduce the error or specified behavior.

Expected behavior:

Explain what you expect to happen when you run the code above.

Actual behavior:

Explain the undesired behavior or error you see when you run the code above.
If you’re seeing an error message, share the full contents of the error message here.

Debug info

  • Streamlit version: (get it with $ streamlit version)
  • Python version: (get it with $ python --version)
  • Using Conda? PipEnv? PyEnv? Pex?
  • OS version:
  • Browser version:

Requirements file

Using Conda? PipEnv? PyEnv? Pex? Share the contents of your requirements file here.
Not sure what a requirements file is? Check out this doc and add a requirements file to your app.

Links

  • Link to your GitHub repo:
  • Link to your deployed app:

Additional information

If needed, add any other context about the problem here.

Here is some example code that allows you to adjust the sidebar by css Ability to set sidebar width · Issue #2058 · streamlit/streamlit · GitHub

thank a lot,I will try it!

but it seems not work, I add the code in my pages, still not work

Can you share a simple example where it doesn’t work? Also, what version of streamlit are you using?

sorry, I am wrong, it worked verywell, thanks a lot!
another question: if the “>” button could be changed? It is too small to pick

Here’s one way to do it

st.markdown(
    """
    <style>
    [data-testid="collapsedControl"] svg {
        height: 3rem;
        width: 3rem;
    }
    </style>
    """,
    unsafe_allow_html=True,
)
1 Like

Thanks a lot,the problem has been solved!

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