Source code
Revision control
Copy as Markdown
Other Tools
Test Info:
- This WPT test may be referenced by the following Test IDs:
- /css/css-text/hyphens/hyphens-manual-inline-011.html - WPT Dashboard Interop Dashboard
<!DOCTYPE html>
<meta charset="UTF-8">
<title>CSS Text: 'hyphens: manual' with 2 explicit hyphenation opportunities (inline)</title>
<link rel="author" title="GĂ©rard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<link rel="match" href="reference/hyphens-manual-inline-011M-ref.html">
<link rel="match" href="reference/hyphens-manual-inline-011H-ref.html">
<!--
when the font has the glyph, or
otherwise. Some fonts will display slightly different glyphs for
these code points. Therefore these 2 reference files.
The M-ref.html reference file means the hyphen-Minus character U+002D.
The H-ref.html reference file means the Hyphen character U+2010.
-->
<meta content="When 'hyphens' is set to 'manual' and applied to an inline element, then words can be hyphenated only if characters inside the words explicitly define hyphenation opportunities. In this test, the characters inside the word 'Deoxyribonucleic' explicitly define 2 hyphenation opportunities, so it can be hyphenated. Since 9 characters can all fit inside the line box of the block box, then the word 'Deoxyribonucleic' is hyphenated only after the 2nd soft hyphen." name="assert">
<style>
div
{
border: black solid 2px;
font-family: monospace;
font-size: 32px;
width: 10ch;
}
span
{
hyphens: manual;
}
</style>
<div>DNA <span>means Deoxy­ribo­nucleic acid</span>.</div>
<!--
Expected result:
DNA means
Deoxyribo-
nucleic
acid.
-->