How to remove the borders of st.expander

I tried this CSS but it is not working

hide_expander_border = """
<style>
.st-bd {border-style: none;}
</style>
"""
st.markdown(hide_expander_border, unsafe_allow_html=True)

Also i am creating these expanders using a for loop

 for i in range(len(distance_per_vehicle)):
                hide_expander_border = """
                <style>
                .st-ae {border_style: none;}
                </style>
                """
                st.markdown(hide_expander_border, unsafe_allow_html=True)
                
                with st.expander(f"See distance travelled between customers for vehicle {i+1}"):
                    st.write(distance_per_vehicle[i], unsafe_allow_html=True)


Thanks

Hey @Mohamed_Abdullah_She,

if you just want to remove all expander borders, you can use the following CSS hack:

hide = """
<style>
ul.streamlit-expander {
    border: 0 !important;
</style>
"""

st.markdown(hide, unsafe_allow_html=True)
1 Like

Hi, @ lukasmasuch,
Thank you, this works