How do I put multiple columns into a row in steamlit?

Using Streamlit
#1

Hi

I’m building an app that will look something like the below. This is basically nesting columns into rows I can see an option for st.columns but I can’t seem to find one for st.rows. Is this layout possible using steamlit or would I be needing to inject html/css to get this to work?

Heading
Row 1
– Column1 – Column2 – Column3
Row 2
– Column4 – Column5 – Column6
Footer info.

#2

Hi @Michael1, welcome to the Streamlit community!

You can achieve this with st.container:

import streamlit as st
c1, c2, c3 = st.columns(3)
c4, c5, c6 = st.columns([6,3,2]) #just to highlight these are different cols

with st.container():
    c1.write("c1")
    c2.write("c2")
    c3.write("c3")

with st.container():
    c4.write("c4")
    c5.write("c5")
    c6.write("c6")

Screen Shot 2022-05-02 at 11.58.58 AM
Screen Shot 2022-05-02 at 11.58.58 AM1046×520 5.68 KB

Best,
Randy

2 Likes
#3

Very helpful thanks for the prompt reply.