Is there a way to center all the elements in st.metric?

Using Streamlit
1

I’ve been able to center all the elements in st.Metrics but have not been able to center the delta.

Any suggestions?

TIA,
Fred

2

Try this:

css='''
[data-testid="metric-container"] {
    width: fit-content;
    margin: auto;
}

[data-testid="metric-container"] > div {
    width: fit-content;
    margin: auto;
}

[data-testid="metric-container"] label {
    width: fit-content;
    margin: auto;
}
'''

# I usually dump any scripts at the bottom of the page to avoid adding unwanted blank lines
st.markdown(f'<style>{css}</style>',unsafe_allow_html=True)

image

2 Likes
Center text in st.metric
Metric: replace arrow with circle
3

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