HTML <wbr> Tag

05-09-2019

---

This is a first article in the month long installment "what's that weird html tag?".

Today we're taking a log at the <wbr> tag.

The <wbr> html element represents a possible wordbreak, or in other words, a position within a text where the browser may insert a break. Even if the normal line-breaking rules would not apply at that location.

Example

<div id="example-paragraphs">
 <p>Lorem ipsum dolor sit amet, <wbr /> consectetur adipisicing elit.</p>
 <p>
  Lorem ipsum dolor sit amet, <wbr /> consectetur adipisicing elit.
  <wbr />Alias aspernatur blanditiis consectetur, <wbr /> eaque ex sequi
  tenetur unde. <wbr /> Accusamus molestiae nobis quasi quibusdam
  reprehenderit? <wbr /> Amet error exercitationem incidunt natus saepe
  tempore!
 </p>
</div>

Browser Support

The <wbr> tag is widely supported, only lacking support on IE and IE Mobile:

Can I Use wbr-element? Data on support for the wbr-element feature across the major browsers from caniuse.com.