<bdi>

Definition

The HTML bdi element is used to isolate a part of text that might be formatted in a different direction from other text on the page. This is useful for languages that are written in a right-to-left direction, such as Arabic or Hebrew.

Attributes

AttributeDescriptionDeprecated
dirSpecifies the direction that text should display within the elementNo

Best Practices

Best practices for using the bdi element include:

  • Use the bdi element to isolate text that is formatted in a different direction from the surrounding text.
  • Avoid using the bdi element for styling purposes, as it is intended for use with bi-directional text.
  • Use the dir attribute to specify the direction of the text inside the bdi element.

Accessibility Considerations

One accessibility concern with the HTML bdi element is that it may not be supported by older browser versions, which could cause the text within the element to be displayed incorrectly.

The bdi element also does not provide any additional semantics or meaning to the text, so it may not be picked up by assistive technologies such as screen readers. It is recommended to use the bdi element in combination with other elements such as the dir attribute or the lang attribute to provide additional context and accessibility information.

Browser Compatibility

ChromeFirefoxSafariInternet ExplorerMicrosoft EdgeOpera
YesYesYesYesYesYes