ui.column

ui.column(width, *args, offset=0, **kwargs)

Responsive row-column based layout

See row for more information.

Parameters

width: int

The width of the column (an integer between 1 and 12).

*args: TagChild | TagAttrs = ()

UI elements to place within the column.

offset: int = 0

The number of columns to offset this column from the end of the previous column.

**kwargs: TagAttrValue = {}

Attributes to place on the column tag.

Returns

Type	Description
Tag	A UI element.

See Also

• row

Examples

#| standalone: true
#| components: [editor, viewer]
#| layout: vertical
#| viewerHeight: 400

## file: app.py
import matplotlib.pyplot as plt
import numpy as np

from shiny import App, Inputs, Outputs, Session, render, ui

app_ui = ui.page_fluid(
    ui.row(
        ui.column(4, ui.input_slider("n", "N", min=0, max=100, value=20)),
        ui.column(8, ui.output_plot("plot")),
    )
)


def server(input: Inputs, output: Outputs, session: Session):
    @render.plot(alt="A histogram")
    def plot() -> object:
        np.random.seed(19680801)
        x = 100 + 15 * np.random.randn(437)

        fig, ax = plt.subplots()
        ax.hist(x, input.n(), density=True)
        return fig


app = App(app_ui, server)