Baseline Widely available
The <wbr>
HTML element represents a word break opportunityâa position within text where the browser may optionally break a line, though its line-breaking rules would not otherwise create a break at that location.
<div id="example-paragraphs">
<p>FernstraÃenbauprivatfinanzierungsgesetz</p>
<p>FernstraÃen<wbr />bau<wbr />privat<wbr />finanzierungs<wbr />gesetz</p>
<p>FernstraÃen­bau­privat­finanzierungs­gesetz</p>
</div>
#example-paragraphs {
background-color: white;
overflow: hidden;
resize: horizontal;
width: 9rem;
border: 2px dashed #999;
}
Attributes
This element only includes the global attributes.
NotesOn UTF-8 encoded pages, <wbr>
behaves like the U+200B ZERO-WIDTH SPACE
code point. In particular, it behaves like a Unicode bidi BN code point, meaning it has no effect on bidi-ordering: <div dir=rtl>123,<wbr>456</div>
displays, when not broken on two lines, 123,456
and not 456,123
.
For the same reason, the <wbr>
element does not introduce a hyphen at the line break point. To make a hyphen appear only at the end of a line, use the soft hyphen character entity (­
) instead.
The Yahoo Style Guide recommends breaking a URL before punctuation, to avoid leaving a punctuation mark at the end of the line, which the reader might mistake for the end of the URL.
<p>
http://this<wbr />.is<wbr />.a<wbr />.really<wbr />.long<wbr />.example<wbr />.com/With<wbr />/deeper<wbr />/level<wbr />/pages<wbr />/deeper<wbr />/level<wbr />/pages<wbr />/deeper<wbr />/level<wbr />/pages<wbr />/deeper<wbr />/level<wbr />/pages<wbr />/deeper<wbr />/level<wbr />/pages
</p>
Result Technical summary Specifications Browser compatibility See also
RetroSearch is an open source project built by @garambo | Open a GitHub Issue
Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo
HTML:
3.2
| Encoding:
UTF-8
| Version:
0.7.3