DxMenu.SubMenuCssClass Property

Specifies the CSS class name for all drop-down menus.

Namespace: DevExpress.Blazor

Assembly: DevExpress.Blazor.v23.2.dll

NuGet Package: DevExpress.Blazor

Declaration

[DefaultValue(null)]
[Parameter]
public string SubMenuCssClass { get; set; }

Property Value

Type	Default	Description
String	null	The CSS class name.

Remarks

Assign a CSS class name to the SubMenuCssClass to apply styles to drop-down menus:

<style>
    .my-dropdown-item {
        <!-- your CSS rules -->
    }
</style>

<div class="card">
    <DxMenu Title="DevExpress"
            ItemsPosition="ItemPosition.Start"
            SubMenuCssClass="my-dropdown-item">
        <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>

If you want to specify custom styles for a specific drop-down menu, use the DxMenuItem.SubMenuCssClass property.