I am setting up a page in streamlit and want to reduce the image or the border in st.file_uploader which will be displayed by default in streamlit app .Tried using CSS but didn't work as expected How to handle this ? Any thoughts?

I want to reduce the image or the border in st.file_uploader which will be displayed by default in streamlit app .Tried using CSS but didn’t work as expected How to handle this ? Any thoughts ?

Could you post the CSS you tried to use?

Thanks

css = ‘’’ [data-testid=‘stFileUploader’] { width: max-content; } [data-testid=‘stFileUploader’] section { padding: 0; float: left; } [data-testid=‘stFileUploader’] section > input + div { display: none; } [data-testid=‘stFileUploader’] section + div { float: right; padding-top: 0; } ‘’’
file = st.markdown(css, unsafe_allow_html=True)
file = st.file_uploader(“Drop your CSV or Excel file here”, type=[‘csv’, ‘xlsx’])
load_data = st.button(‘SUBMIT’)

This just shows the BROWSE FILES and the lable

Just wrap your CSS in a tag and you should be fine.

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