HTML <bdi> Tag

Definition and usage

BDI Refers to bidirectional isolation (Bi-Directional Isolation)

<bdi> The tag isolates a portion of text, which may be different in direction from the surrounding text.

This element is very useful when embedding content generated by users with unknown text direction.

Example

Isolate the username from the surrounding text direction settings:

<ul>
  <li>User <bdi>Bill</bdi>: 70 Points</li>
  <li>User <bdi>Steve</bdi>: 80 Points</li>
  <li>User <bdi>إيان</bdi>: 90 Points</li>
</ul>

Try It Yourself

Global Attributes

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

Event Attributes

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

Browser Support

The numbers in the table indicate the first browser version that fully supports this attribute.

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
16.0 79.0 10.0 Not Supported 15.0