DxMenu.SizeMode Property

Specifies the size of the component’s inner elements. Also affects the component’s size.

Assembly : DevExpress.Blazor.v25.2.dll

Declaration

csharp

[DefaultValue(null)]
[Parameter]
public SizeMode? SizeMode { get; set; }

Property Value

Type	Default	Description
Nullable<SizeMode>	null

The size mode. If the property is not specified (the value is null), the size is determined by the SizeMode global option.

Available values:

Name	Description
Small

Small size.

| | Medium |

Medium size.

| | Large |

Large size.

Remarks

Use the SizeMode property to specify the size mode for the Menu. The following code snippet applies the Large mode:

razor

<div class="card">
    <DxMenu Title="DevExpress"
            ItemsPosition="ItemPosition.Start"
            SizeMode="SizeMode.Large">
        <Items>
            <DxMenuItem Text="Products">
                <Items>
                    <DxMenuItem Text="Subscriptions / Packs" />
                    <DxMenuItem Text=".NET Windows Forms Components" />
                    <DxMenuItem Text="Reporting / Printing Suites" />
                    <DxMenuItem Text="VCL Components and Tools" />
                    <DxMenuItem Text="ASP.NET Components" />
                </Items>
            </DxMenuItem>
            <DxMenuItem Text="Support">
                <Items>
                    <DxMenuItem Text="Knowledge Base" />
                    <DxMenuItem Text="Documentation" />
                    <DxMenuItem Text="Support Center" />
                    <DxMenuItem Text="Newsgroups" />
                    <DxMenuItem Text="Best Practices" />
                </Items>
            </DxMenuItem>
            <DxMenuItem Text="Documentation" BeginGroup="true" />
            <DxMenuItem Text="Demos" />
            <DxMenuItem Text="Blogs" />
        </Items>
    </DxMenu>
</div>

The following image shows the same Menu component in different size modes:

For additional information, refer to Size Modes.