Badge Container

The BadgeContainer component allows you to target text, HTML elements or Angular components that cannot host content, by wrapping both the targeted element and the Badge inside a kendo-badge-container tag.

When using the Badge without the BadgeContainer, make sure the HTML element or Angular component which contains a badge has css position other than static and allows overflow content.

The following example demonstrates both approaches in action.

Example

View Source

Edit In Stackblitz

Change Theme:

Suggested Links

Getting Started

Align and Position

Was this article helpful?

Kendo UI for Angular

Community

Web App Development

Complete .net Toolbox

Telerik DevCraft

Get in touch

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