New to Telerik UI for Blazor? Download Free 30-day trial

TabStrip - Tab Positions

Configurator

Tabs Position

Forecast

23ºC

Sunny weather in Sofia.

  • Tab-positions.razor
  • WeatherCard.razor
Loading the demo source code...please wait.

Style in ThemeBuilder

  • Custom SASS variables
  • Atomic customizations
  • Sharing projects
Start Theming

Description

Telerik UI for Blazor TabStrip displays a collection of tabs, containing associated content, which enables the user to switch between different views inside a single component. It allows you to control the position of its items (tabs). The tab titles display on top of the tab content.

These Tabs are the building blocks of the TabStrip. The component allows individual configuration of the declared tags.

To customize their position, use the optional TabPosition attribute of the TabStrip tag. It takes a member of the TabPosition enum. The supported position options are:

  • Top (default) - If you choose the top position, the tabs will render above the component content. As this is the default tab position option, you do not need to explicitly set it.
  • Left - The left position will allow you to render the tabs on the left side of the component content.
  • Right - The right position will allow you to render the tabs on the right side of the component content.
  • Bottom - The bottom position will allow you to render the tabs underneath the component content.

The current demo allows you to configure the TabStrip tabs position and test all setups. Use the DropDownList in the Configurator section to apply the Top, Left, Right, or Bottom positions and explore the differences.

This Blazor TabStrip Tab Positions example is part of a unique collection of hundreds of Blazor demos, with which you can see all Telerik UI for Blazor components and their features in action. View the source code of the demos from the library or directly adapt, and edit them and their theme appearance in Telerik REPL for Blazor or ThemeBuilder.
An error has occurred. This application may no longer respond until reloaded.