bdi

I. Description

The HTML bdi ('Bidirectional Isolate') element is used to wrap text which may be either left-to-right or right-to-left.

When text is being inserted into a webpage, and the directionality (left-to-right, or right-to-left) is not known ahead of time text rendering issues may arise. The bdi element exists to solve these issues by instructing the browser to treat the text contained within the bdi element separately from the surrounding text.

II. Examples

<!DOCTYPE html>
<html>
    <head>
        <title>Example Page</title>
    </head>
    <body>
        <h1>Chess Tournament Competitors</h1>
        <p>
            Below is a list of names of individuals who
            will be participating in this year's chess
            tournament.
        </p>
        <ol>
            <li><bdi>James Smith</bdi></li>
            <li><bdi>刚张</bdi></li>
            <li><bdi>أحمد أبو خاطر</bdi></li>
            <li><bdi>Alejandro Hernandez</bdi></li>
        </ol>
    </body>
</html>