1. Blocks Layout
  2. Row

New to Gradio? Start here: Getting Started

See the Release History

←

Group

Tab

→

Row

gradio.Row(···)

Description

Row is a layout element within Blocks that renders all children horizontally.

Example Usage

with gr.Blocks() as demo:
    with gr.Row():
        gr.Image("lion.jpg", scale=2)
        gr.Image("tiger.jpg", scale=1)
demo.launch()

Initialization

Parameters
🔗 
variant: Literal['default', 'panel', 'compact']
default = "default"

row type, 'default' (no background), 'panel' (gray background color and rounded corners), or 'compact' (rounded corners and no internal gap).

🔗 
visible: bool
default = True

If False, row will be hidden.

🔗 
elem_id: str | None
default = None

An optional string that is assigned as the id of this component in the HTML DOM. Can be used for targeting CSS styles.

🔗 
elem_classes: list[str] | str | None
default = None

An optional string or list of strings that are assigned as the class of this component in the HTML DOM. Can be used for targeting CSS styles.

🔗 
render: bool
default = True

If False, this layout will not be rendered in the Blocks context. Should be used if the intention is to assign event listeners now but render the component later.

🔗 
equal_height: bool
default = True

If True, makes every child element have equal height

🔗 
show_progress: bool
default = False

If True, shows progress animation when being updated.

Guides

Controlling Layout

←

Group

Tab

→