Is it possible to make this layout in Streamlit?

  1. Are you running your app locally or is it deployed? Locally.
  2. Share the full text of the error message (not a screenshot). Not an error.
  3. Share the Streamlit and Python versions. Python: 3.8.16, Streamlit: 1.28.0.

Hey all.
I am looking to make this layout on Streamlit. Is it possible? Thanks.

Hey @MedAzizTousli! Welcome to the community, itโ€™s great to have you here! :wave:

You sure can! Streamlit provides a flexible layout system that lets you create multiple columns. Hereโ€™s how you can create the layout depicted in your image:

Hereโ€™s the code:

import streamlit as st

st.title("Streamlit Column Layout")

# First row with two columns
col1_1, col1_2 = st.columns(2)
with col1_1:
    st.write("Column 1.1")
with col1_2:
    st.write("Column 1.2")

# Second row with a single centered column
col2_left, col2, col2_right = st.columns([1, 2, 1])
with col2:
    st.write("Column 2")

# Third row with two columns
col3_1, col3_2 = st.columns(2)
with col3_1:
    st.write("Column 3.1")
with col3_2:
    st.write("Column 3.2")

Let me know if youโ€™d need anything else!


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