Summary
Hello! I’m struggling to find a solution that allows my streamlit application to have clean, and consistent, dividers per row. The way I’m formatting the UI is pushing the dividers lower because of name size. I’m aiming for a consistent size without having to abbreviate the names. Attached below is the function where I’m having this issue. See pictures for examples.
Steps to reproduce
Code snippet:
def output_results_columns(filtered_df):
col1, col2, col3, col4 = st.columns(4)
with col1:
col1container = st.container()
with col2:
col2container = st.container()
with col3:
col3container = st.container()
with col4:
col4container = st.container()
curr_col_count = 0
for _, row in filtered_df.iterrows():
# Choose the container based on the current column count
if curr_col_count == 0:
container = col1container
elif curr_col_count == 1:
container = col2container
elif curr_col_count == 2:
container = col3container
else:
container = col4container
with container:
innercol1, innercol2 = st.columns([0.25, 0.75])
with innercol1:
if row["profile_pic"] == "N/A":
st.image("https://upload.wikimedia.org/wikipedia/commons/thumb/a/ac/No_image_available.svg/1024px-No_image_available.svg.png")
else:
st.image(row['profile_pic'], use_column_width = "auto")
with innercol2:
st.write(f"{row['full_name']} ({row['party'][0]})")
st.caption(f"{row['state_name']} | {row['district_value']}")
st.divider()
# Update the current column count
curr_col_count += 1
if curr_col_count == 4:
curr_col_count = 0
Expected behavior:
Actual behavior: