# Layouts and Containers

Source: https://docs.streamlit.io/develop/api-reference/layout

## Complex layouts

Streamlit provides several options for controlling how different elements are laid out on the screen.

**[Columns](https://docs.streamlit.io/develop/api-reference/layout/st.columns)**: Insert containers laid out as side-by-side columns.

```python
col1, col2 = st.columns(2)
col1.write("this is column 1")
col2.write("this is column 2")
```

**[Container](https://docs.streamlit.io/develop/api-reference/layout/st.container)**: Insert a multi-element container.

```python
c = st.container()
st.write("This will show last")
c.write("This will show first")
c.write("This will show second")
```

**[Modal dialog](https://docs.streamlit.io/develop/api-reference/execution-flow/st.dialog)**: Insert a modal dialog that can rerun independently from the rest of the script.

```python
@st.dialog("Sign up")
def email_form():
    name = st.text_input("Name")
    email = st.text_input("Email", type="email")
```

**[Empty](https://docs.streamlit.io/develop/api-reference/layout/st.empty)**: Insert a single-element container.

```python
c = st.empty()
st.write("This will show last")
c.write("This will be replaced")
c.write("This will show first")
```

**[Expander](https://docs.streamlit.io/develop/api-reference/layout/st.expander)**: Insert a multi-element container that can be expanded/collapsed.

```python
with st.expander("Open to see more"):
  st.write("This is more content")
```

**[Grid](https://docs.streamlit.io/develop/api-reference/layout/st.grid)**: Insert a responsive grid of cells that reflow with the available width.

```python
grid = st.grid(3)
grid.metric("Revenue", "$1.2M", "+8%")
grid.metric("Pipeline", "$4.8M", "+12%")
grid.metric("Retention", "96%", "-0.4%")
```

**[Popover](https://docs.streamlit.io/develop/api-reference/layout/st.popover)**: Insert a multi-element popover container that can be opened/closed.

```python
with st.popover("Settings"):
  st.checkbox("Show completed")
```

**[Sidebar](https://docs.streamlit.io/develop/api-reference/layout/st.sidebar)**: Display items in a sidebar.

```python
st.sidebar.write("This lives in the sidebar")
st.sidebar.button("Click me!")
```

**[Bottom](https://docs.streamlit.io/develop/api-reference/layout/st.bottom)**: Display items at the bottom of the window.

```python
st.bottom.chat_input("Say something")
```

**[Space](https://docs.streamlit.io/develop/api-reference/layout/st.space)**: Add vertical or horizontal space.

```python
st.space("small")
```

**[Tabs](https://docs.streamlit.io/develop/api-reference/layout/st.tabs)**: Insert containers separated into tabs.

```python
tab1, tab2 = st.tabs(["Tab 1", "Tab2"])
tab1.write("this is tab 1")
tab2.write("this is tab 2")
```
