A flexbox row container component that horizontally arranges RadzenColumn components in a responsive 12-column grid layout. RadzenRow provides gap spacing, alignment, and justification controls for creating flexible, responsive page layouts. Serves as a container for RadzenColumn components, creating a horizontal flexbox layout where columns automatically wrap to the next line when their combined Size values exceed 12. Supports Gap and RowGap properties for spacing between columns and wrapped rows, AlignItems for vertical alignment (start, center, end, stretch, baseline), JustifyContent for horizontal distribution (start, center, end, space-between, space-around), and works seamlessly with RadzenColumn's breakpoint-specific sizing. Use AlignItems and JustifyContent from the base RadzenFlexComponent to control layout behavior.
IComponent
IHandleEvent
IHandleAfterRender
RadzenFlexComponent.JustifyContent
RadzenFlexComponent.AlignItems
RadzenComponentWithChildren.ChildContent
RadzenComponent.SetParametersAsync
RadzenComponent.OnAfterRenderAsync
RadzenComponent.RaiseContextMenu
RadzenComponent.RaiseMouseEnter
RadzenComponent.AddContextMenu
RadzenComponent.RaiseMouseLeave
RadzenComponent.OnBecameInvisible
RadzenComponent.DefaultCulture
RadzenComponent.IsJSRuntimeAvailable
ComponentBase.OnInitializedAsync
ComponentBase.OnParametersSet
ComponentBase.OnParametersSetAsync
ComponentBase.StateHasChanged
ComponentBase.ShouldRender
ComponentBase.OnAfterRender
ComponentBase.InvokeAsync
ComponentBase.DispatchExceptionAsync
ComponentBase.RendererInfo
ComponentBase.Assets
ComponentBase.AssignedRenderMode
Namespace: Radzen.Blazor
Assembly: Radzen.Blazor.dll
public class RadzenRow : RadzenFlexComponent, IComponent, IHandleEvent, IHandleAfterRenderBasic row with columns and gap:
<RadzenRow Gap="1rem">
<RadzenColumn Size="4">Column 1</RadzenColumn>
<RadzenColumn Size="4">Column 2</RadzenColumn>
<RadzenColumn Size="4">Column 3</RadzenColumn>
</RadzenRow>
Row with alignment and justification:
<RadzenRow AlignItems="AlignItems.Center" JustifyContent="JustifyContent.SpaceBetween" Gap="2rem">
<RadzenColumn Size="3">Left</RadzenColumn>
<RadzenColumn Size="3">Right</RadzenColumn>
</RadzenRow>A flexbox row container component that horizontally arranges RadzenColumn components in a responsive 12-column grid layout. RadzenRow provides gap spacing, alignment, and justification controls for creating flexible, responsive page layouts. Serves as a container for RadzenColumn components, creating a horizontal flexbox layout where columns automatically wrap to the next line when their combined Size values exceed 12. Supports Gap and RowGap properties for spacing between columns and wrapped rows, AlignItems for vertical alignment (start, center, end, stretch, baseline), JustifyContent for horizontal distribution (start, center, end, space-between, space-around), and works seamlessly with RadzenColumn's breakpoint-specific sizing. Use AlignItems and JustifyContent from the base RadzenFlexComponent to control layout behavior.
public RadzenRow()Gets or sets the spacing between columns within the row. Accepts CSS length values (e.g., "1rem", "16px", "2em") or unitless numbers (interpreted as pixels). This sets the horizontal gap between column elements.
public string Gap { get; set; }
| Type | Description |
|---|---|
| string | Gets or sets the spacing between columns within the row. Accepts CSS length values (e.g., "1rem", "16px", "2em") or unitless numbers (interpreted as pixels). This sets the horizontal gap between column elements. |
Gets or sets the vertical spacing between wrapped rows when columns wrap to multiple lines. Accepts CSS length values (e.g., "1rem", "16px", "2em") or unitless numbers (interpreted as pixels). Only applicable when columns wrap due to exceeding the 12-column limit.
public string RowGap { get; set; }
| Type | Description |
|---|---|
| string | Gets or sets the vertical spacing between wrapped rows when columns wrap to multiple lines. Accepts CSS length values (e.g., "1rem", "16px", "2em") or unitless numbers (interpreted as pixels). Only applicable when columns wrap due to exceeding the 12-column limit. |
protected override void BuildRenderTree(Rendering.RenderTreeBuilder __builder)
| Type | Name | Description |
|---|---|---|
| Rendering.RenderTreeBuilder | __builder |
protected override string GetComponentCssClass()
| Type | Description |
|---|---|
| string |
Gets the component CSS style.
protected string GetComponentStyle()
| Type | Description |
|---|---|
| string |
Gets the final CSS style rendered by the component. Combines it with a style custom attribute.
protected string GetStyle()
| Type | Description |
|---|---|
| string |