Badge Container

The Badge delivers the BadgeContainer component that enables you to target text, HTML elements, or Angular components which cannot host content.

To implement the functionality, wrap both the targeted element and the Badge inside a kendo-badge-container tag.

When you use the Badge without the BadgeContainer, make sure that the CSS position of the HTML element or Angular component which contains a badge is different from static and allows overflow content.

The following example demonstrates both approaches in action.

Example

View Source

Edit In Stackblitz

Change Theme:

Suggested Links

Overview

Alignment and Positioning

Was this article helpful?

Getting Started

Support Resources

Community

Telerik and Kendo UI are part of Progress product portfolio. Progress is the leading provider of application development and digital experience technologies.

Copyright © 2021, Progress Software Corporation and/or its subsidiaries or affiliates. All Rights Reserved. Progress, Telerik, Ipswitch, and certain product names used herein are trademarks or registered trademarks of Progress Software Corporation and/or one of its subsidiaries or affiliates in the U.S. and/or other countries. See Trademarks for appropriate markings.

DO NOT SELL MY PERSONAL INFORMATION