Skip to main content
All docs
V24.2

DevExpress v24.2 Update — Your Feedback Matters

Our What's New in v24.2 webpage includes product-specific surveys. Your response to our survey questions will help us measure product satisfaction for features released in this major update and help us refine our plans for our next major release.

Take the survey Not interested

DxSplitterPane.Size Property

Specifies the size of the pane.

Namespace: DevExpress.Blazor

Assembly: DevExpress.Blazor.v24.2.dll

NuGet Package: DevExpress.Blazor

#Declaration

C#
[Parameter]
public string Size { get; set; }

#Property Value

Type Description
String

The size, in CSS units.

#Remarks

Use the Size property to specify the width of vertical panes and the height of horizontal panes.

When the AllowResize property is set to true, users can resize the pane. Use the MinSize and MaxSize properties to restrict changes to the pane.

razor
<DxSplitter CssClass="border"  Width="100%" Height="600px">
    <Panes>
        <DxSplitterPane Size="30%" MinSize="100px">@PaneContent1</DxSplitterPane>
        <DxSplitterPane Size="50%" MaxSize="70%">@PaneContent2</DxSplitterPane>
        <DxSplitterPane>@PaneContent3</DxSplitterPane>
    </Panes>
</DxSplitter>

Handle the SizeChanged event to react to pane size changes.

Note that the size of at least one panel should remain undefined. Otherwise, the Splitter component ignores the size of the last pane.

Run Demo

See Also