# \<bdi\>: The Bidirectional Isolation element

**URL:** <https://discourse.mozilla.org/t/bdi-the-bidirectional-isolation-element/27931>\
**Category:** MDN\
**Created:** [April 22, 2018, 5:24pm UTC](https://discourse.mozilla.org/t/bdi-the-bidirectional-isolation-element/27931 "2018-04-22T17:24:54Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![laassari](https://avatars.discourse-cdn.com/v4/letter/l/f19dbf/32.png) [@laassari](https://discourse.mozilla.org/u/laassari)\
**Post date:** [April 22, 2018, 5:24pm UTC](https://discourse.mozilla.org/t/bdi-the-bidirectional-isolation-element/27931/1 "2018-04-22T17:24:54Z")

</div>

The example on the [`<bdi>` page](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/bdi#Example) says:

```
<p dir="ltr">This arabic word <bdi>ARABIC_PLACEHOLDER</bdi>
is automatically displayed right-to-left.</p>

```

I believe the intent is to put an Arabic example there, like:

```
<p dir="ltr">This arabic phrase <bdi>.مثال بالعربية</bdi>
is automatically displayed right-to-left.</p>

```

Is that right? should I edit the page?

---

<div class="post-metadata">

**Author:** ![Pike](https://sea1.discourse-cdn.com/flex001/user_avatar/discourse.mozilla.org/pike/32/20587_2.png) [@Pike](https://discourse.mozilla.org/u/Pike)\
**Post date:** [April 22, 2018, 7:59pm UTC](https://discourse.mozilla.org/t/bdi-the-bidirectional-isolation-element/27931/2 "2018-04-22T19:59:30Z")

</div>

Yeah, the example is wrong, and the explanation is wrong. \<bdi\> doesn’t do right-to-left layout, it creates a new context for the bidi algorithm. That way, things like punctuation marks align to the text inside the bdi, and not the surroundings.

@zbraniecki, do you have a good example in your toolbox?

---

<div class="post-metadata">

**Author:** ![laassari](https://avatars.discourse-cdn.com/v4/letter/l/f19dbf/32.png) [@laassari](https://discourse.mozilla.org/u/laassari)\
**Post date:** [April 22, 2018, 8:05pm UTC](https://discourse.mozilla.org/t/bdi-the-bidirectional-isolation-element/27931/3 "2018-04-22T20:05:36Z")

</div>

yeah, that’s why I put a dot at the end of the Arabic example

---

<div class="post-metadata">

**Author:** ![sheppy](https://sea1.discourse-cdn.com/flex001/user_avatar/discourse.mozilla.org/sheppy/32/20903_2.png) [@sheppy](https://discourse.mozilla.org/u/sheppy)\
**Post date:** [April 23, 2018, 11:43pm UTC](https://discourse.mozilla.org/t/bdi-the-bidirectional-isolation-element/27931/4 "2018-04-23T23:43:00Z")

</div>

The reason why that text is in English is to allow English readers to see that the characters are reversed. In theory. I don’t know that that actually works. 🙂