HTML bdi tag

Example

Isolate the usernames from the surrounding text-direction settings: If the bdi element is not supported in the browser, the username of the Arabic user would confuse the text (the bidirectional algorithm would put the colon and the number "90" next to the word "User" rather than next to the word "points").

<ul>
<li>User <bdi>hrefs</bdi>: 60 points</li>
<li>User <bdi>jdoe</bdi>: 80 points</li>
<li>User <bdi>إيان</bdi>: 90 points</li>
</ul>

Definition and Usage

BDI stands for Bi-Directional Isolation.

The <bdi> tag isolates a part of text that might be formatted in a different direction from other text outside it.

This element is useful when embedding user-generated content with an unknown text direction.

Global Attributes

The <bdi> tag also supports the Global Attributes in HTML.

Event Attributes

The <bdi> tag also supports the Event Attributes in HTML.