Align different widget across multiple columns

Dears

Thanks for this awesome library.

I want to align horizontally different widgets (checkbox, selectbox, text_input) placed in multiple columns. Is this possible with streamlit?

This is what I tried.

col21, col22, col23 = st.columns(3)
                                    
                                    with col21:
                                        st.write("Column Name")
                                        for i, col in enumerate(columns):
                                            st.text(label="",
                                            options=(columns[i],),
                                            key=col+"text_wight"+str(i))

                                    with col22:
                                        st.write("Is an assessment unit?")
                                        for i in range(len(columns)):
                                            st.checkbox("",
                                            options=["Yes", "No"],
                                            key=col+"true_wight"+str(i))

                                    with col23:
                                        st.write("Assessment Components")
                                        for i in range(len(columns)):
                                            st.selectbox("",
                                            options=evaluation_item,
                                            key=col+"eval_wight"+str(i))

One option is to make separate rows for each item, and create your columns within each row.

For example:

import streamlit as st

columns = ["a", "b", "c"]

evaluation_item = ["a", "b", "c"]

col21, col22, col23 = st.columns(3)

with col21:
    st.write("Column Name")

with col22:
    st.write("Is an assessment unit?")

with col23:
    st.write("Assessment Components")

for i, col in enumerate(columns):
    col21, col22, col23 = st.columns(3)

    with col21:
        st.selectbox(label="", options=(columns[i],), key=col + "text_wight" + str(i))

    with col22:
        st.write("# ")
        st.checkbox("", key=col + "true_wight" + str(i))

    with col23:
        st.selectbox("", options=evaluation_item, key=col + "eval_wight" + str(i))

(Note that I added an extra space via st.write("# ") to make the checkboxes line up with the selectboxes because of the space that the selectboxes have above them for labels)

3 Likes

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