Skip to main content

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

TabsPosition Enum

Lists values that specify where tab headers appear relative to content.

Namespace: DevExpress.Blazor

Assembly: DevExpress.Blazor.v24.2.dll

NuGet Package: DevExpress.Blazor

#Declaration

C#
public enum TabsPosition

#Members

Name Description Illustration
Top

Tab headers are above content.

Top tab header position

Bottom

Tab headers are below content.

Bottom tab header position

Left

Tab headers are to the left of content.

Left tab header position

Right

Tab headers are to the right of content.

Right tab header position

#Related API Members

The following properties accept/return TabsPosition values:

#Remarks

This example positions tab headers below the component:

Razor
<DxTabs TabsPosition="TabsPosition.Bottom">
    <DxTabPage Text="Home">
        <div class="p-2">
            The Home tab's content
        </div>
    </DxTabPage>
    <DxTabPage Text="Products">
        <div class="p-2">
            The Products tab's content
        </div>
    </DxTabPage>
    <DxTabPage Text="Support">
        <div class="p-2">
            The Support tab's content
        </div>
    </DxTabPage>
</DxTabs>

Bottom tab header position

Run Demo: Tab Position

See Also