How to make a custom container like a button

HI,
I want to make like this container :
image

a container with a text on the left and an icon on the right.

i tried this :

with st.container(border=True,height=50):
        col1, col2 = st.columns([0.5, 0.2])
 with col1:
        st.write("text to add")
    with col2:
        st.image("images/arrow.png",width=26)

it gives something like this :
image

my second question…can i make this container clickable ? I mean when the use click on the container, I need to fire some logic.
thanks

1 Like

You can utilize multiple containers and columns to control the spacing and margin. For a click, you could add a markdown hyperlink or use a button within the container.

import streamlit as st


with st.container(height=50, border=False):
    column1, column2, column3 = st.columns([1, 1, 1])
    with column1:
        st.empty()
    with column2:
        with st.container(border=True,height=50):
            col1, col2, col3 = st.columns([1, 2, 1])
            with col1:
                st.empty()
            with col2:
                st.write("[Click here](https://example.com)")
            with col3:
                st.image("https://cdn-icons-png.flaticon.com/512/32/32213.png", width=23)
    with column3:
        st.empty()

thanks

But is it possible to make a container behave exactly like an st.button ?

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