HTML Tag: `bdi`

Bidirectional isolate — isolates text from its surroundings in circumstances where bidirectional formatting may be required.

The importance of bdi is not that it can be used to change the directionality of text — that is what bdo is for. Instead, it allows a browser to distinguish text that should be treated separately from that around it, such as when a fragment of Eastern right-to-left language text is included in, or mixed with, a Western left-to-right language section and may otherwise result in an inaccurate jumble.

Optional Attributes

Global attributes

Example


<ol>
    <li>Gold! <bdi>Jane</bdi> (11.11 seconds)</li>
    <li>Silver! <bdi>John</bdi> (12.23 seconds)</li>
    <li>Bronze! <bdi>حنيفة</bdi> (12.42 seconds)</li>
</ol>

<!-- Imagine these were user-generated... -->
<!-- Whereas bdi isn't necessary for the first item, it is for the third. -->