DxTabs.TabsPosition Property

Specifies where tab headers appear relative to content.

Assembly : DevExpress.Blazor.v25.2.dll

Declaration

csharp

[DefaultValue(TabsPosition.Top)]
[Parameter]
public TabsPosition TabsPosition { get; set; }

Property Value

Type	Default	Description
TabsPosition	Top

An enumeration value.

Available values:

Name	Description	Illustration
Top

Tab headers are above content.

| | Bottom |

Tab headers are below content.

| | Left |

Tab headers are to the left of content.

| | Right |

Tab headers are to the right of content.

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>

Run Demo: Tab Position