• Material 3
  • Fluent
  • Fluent 2
  • Bootstrap 5
  • Tailwind CSS
  • High Contrast
  • Fluent 2 High Contrast
Preferences
Mode Selection
Touch
Mouse
Theme Selection
Theme Mode
Localization
*Translated by Google Translator.
Currency

Example of Overflow Modes in ASP.NET Core Breadcrumb Control

This sample demonstrates the different types of overflow mode such as Hidden, Menu, Wrap, Collapsed, and Scroll in the Breadcrumb component.

DEMO
SOURCE
Overflow Mode - Hidden
Overflow Mode - Menu
Overflow Mode - Collapsed
Overflow Mode - Wrap
Overflow Mode - Scroll

Overflow mode limits the number of items to be displayed in the view when the breadcrumb's width exceeds the container width or maxItems property.

The following overflow mode's were available in the Breadcrumb component.

  • Hidden - Specified maxItems count will be visible and the remaining items will be hidden. While clicking on the previous item, the hidden item will become visible.
  • Collapsed - Only the first and last items will be visible, and the remaining items will be hidden with collapsed icon. When the collapsed icon is clicked, all the items become visible.
  • Menu - Shows the number of breadcrumb items that can be accommodated within the container space, and creates a sub menu with the remaining items.
  • Wrap - Wraps the items on multiple lines when the Breadcrumb�s width exceeds the container space.
  • Scroll - Shows an HTML scroll bar when the Breadcrumb�s width exceeds the container space.
  • None - Shows all the items on a single line.

More information about Breadcrumb component can be found in this documentation section.

Transform your ASP.NET Core web apps today with Syncfusion® ASP.NET Core components
85+ high-performance and responsive UI components
Dedicated support
Hassle-free licensing
TRY IT FOR FREE
opens in a new tab