Expander looks different... Not how it appears in the docs

Long story short, st.expander() gives me something like this:

… but what I really want is this (from the layout options post from a while ago):
Screenshot from 2021-10-27 03-49-36

I don’t dig the box. How do I remove the box!

Thanks!

Hi @Raihaan :wave:

You can use a CSS selector in conjunction with st.markdown to hide the expander border. Here’s an example:

import streamlit as st

hide_expander_border = """
<style>
.st-bd {border-style: none;}
</style>
"""

if st.checkbox("Remove expander border"):
    st.markdown(hide_expander_border, unsafe_allow_html=True)

with st.expander("Click to expand"):
    st.header("Test")

expander-border

Happy Streamlit-ing! :balloon:
Snehan

3 Likes