Update web-platform-tests to revision eb12303bec1d47bbe91ebf011d17d81ec6fce68d

This commit is contained in:
WPT Sync Bot 2020-03-25 08:18:42 +00:00
parent 6ca767d7f9
commit 916ba6ef4d
467 changed files with 6716 additions and 1478 deletions

View file

@ -0,0 +1,41 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<title>CSS Text: 'hyphens: auto' with a valid 'lang' attribute specification</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<link rel="help" href="https://www.w3.org/TR/css-text-3/#hyphenation">
<link rel="match" href="reference/hyphens-auto-010-ref.html">
<meta content="" name="flags">
<meta content="When 'hyphens' is set to 'auto' and when 'lang' attribute is also set to a valid value, then words may be broken at hyphenation opportunities determined automatically by an hyphenation resource appropriate to the language of the text involved.">
<style>
div
{
border: black solid 2px;
font-family: monospace;
font-size: 32px;
margin-bottom: 0.25em;
width: 6ch;
}
div#test
{
hyphens: auto;
}
div#reference
{
hyphens: none;
}
</style>
<body lang="en">
<p>Test passes if each black-bordered rectangles have identical inside content.
<div id="test">regulation implementation</div>
<div id="reference">regu-lation imple-menta-tion</div>

View file

@ -0,0 +1,47 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<title>CSS Text: 'hyphens: manual' with no explicit hyphenation opportunity (basic)</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<link rel="help" href="https://www.w3.org/TR/css-text-3/#hyphenation">
<link rel="match" href="reference/hyphens-manual-010-ref.html">
<meta content="" name="flags">
<meta content="When 'hyphens' is set to 'manual', then words can be hyphenated only if characters inside the words explicitly define hyphenation opportunities. In this test, the characters inside the word 'Deoxyribonucleic' do not explicitly define hyphenation opportunities, so it must not be hyphenated." name="assert">
<style>
div
{
border: black solid 2px;
font-family: monospace;
font-size: 32px;
margin-bottom: 0.25em;
width: 10ch;
}
div#test
{
hyphens: manual;
}
div#reference
{
hyphens: none;
}
</style>
<body lang="en">
<p>Test passes if the characters inside of each black-bordered rectangles are laid out identically. Only "ucleic" should be outside of the black-bordered rectangles.
<div id="test">Deoxyribonucleic acid</div>
<div id="reference">Deoxyribonucleic acid</div>
<!--
Extended form of abreviation DNA
-->

View file

@ -0,0 +1,45 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<title>CSS Text: 'hyphens: manual' with 2 explicit hyphenation opportunities</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<link rel="help" href="https://www.w3.org/TR/css-text-3/#hyphenation">
<link rel="match" href="reference/hyphens-manual-011-ref.html">
<meta content="" name="flags">
<meta content="When 'hyphens' is set to 'manual', 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;
margin-bottom: 0.25em;
width: 10ch;
}
div#test
{
hyphens: manual;
}
div#reference
{
hyphens: none;
}
</style>
<p>Test passes if the characters inside of each black-bordered rectangles are laid out identically.
<div id="test">Deoxy&shy;ribo&shy;nucleic acid</div>
<div id="reference">Deoxyribo-nucleic acid</div>
<!--
Extended form of abreviation DNA
-->

View file

@ -0,0 +1,45 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<title>CSS Text: 'hyphens: manual' with 4 explicit hyphenation opportunities</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<link rel="help" href="https://www.w3.org/TR/css-text-3/#hyphenation">
<link rel="match" href="reference/hyphens-manual-011-ref.html">
<meta content="" name="flags">
<meta content="When 'hyphens' is set to 'manual', 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 4 hyphenation opportunities. Since 9 characters can all fit inside the line box of the block box, then the word 'Deoxyribonucleic' is hyphenated only after the 3rd soft hyphen." name="assert">
<style>
div
{
border: black solid 2px;
font-family: monospace;
font-size: 32px;
margin-bottom: 0.25em;
width: 10ch;
}
div#test
{
hyphens: manual;
}
div#reference
{
hyphens: none;
}
</style>
<p>Test passes if the characters inside of each black-bordered rectangles are laid out identically.
<div id="test">Deo&shy;xy&shy;ribo&shy;nu&shy;cleic acid</div>
<div id="reference">Deoxyribo-nucleic acid</div>
<!--
Extended form of abreviation DNA
-->

View file

@ -0,0 +1,45 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<title>CSS Text: 'hyphens: manual' with 1 explicit hyphenation opportunity</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<link rel="help" href="https://www.w3.org/TR/css-text-3/#hyphenation">
<link rel="match" href="reference/hyphens-manual-013-ref.html">
<meta content="" name="flags">
<meta content="When 'hyphens' is set to 'manual', 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 1 and only 1 hyphenation opportunity, so it can be hyphenated only at such point." name="assert">
<style>
div
{
border: black solid 2px;
font-family: monospace;
font-size: 32px;
margin-bottom: 0.25em;
width: 10ch;
}
div#test
{
hyphens: manual;
}
div#reference
{
hyphens: none;
}
</style>
<p>Test passes if the characters inside of each black-bordered rectangles are laid out identically. Only the "c" of "nucleic" should be outside of each black-bordered rectangles.
<div id="test">Deoxy&shy;ribonucleic acid</div>
<div id="reference">Deoxy-ribonucleic acid</div>
<!--
Extended form of abreviation DNA
-->

View file

@ -0,0 +1,42 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<title>CSS Text: 'hyphens: none' with explicit hyphenation opportunities</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<link rel="help" href="https://www.w3.org/TR/css-text-3/#hyphenation">
<link rel="match" href="reference/hyphens-manual-010-ref.html">
<meta content="" name="flags">
<meta content="This test checks that, when 'hyphens' is set to 'none', then long words are not hyphenated, even if characters inside long words explicitly define hyphenation opportunities." name="assert">
<style>
div
{
border: black solid 2px;
font-family: monospace;
font-size: 32px;
margin-bottom: 0.25em;
width: 10ch;
}
div#test
{
hyphens: none;
}
</style>
<body>
<p>Test passes if the characters inside of each black-bordered rectangles are laid out identically. Only "ucleic" should be outside of the black-bordered rectangles.
<div id="test">Deoxy&shy;ribo&shy;nucleic acid</div>
<div id="reference">Deoxyribonucleic acid</div>
<!--
Extended form of abreviation DNA
-->

View file

@ -0,0 +1,27 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<title>CSS Reference Test</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style>
div
{
border: black solid 2px;
font-family: monospace;
font-size: 32px;
hyphens: none;
margin-bottom: 0.25em;
width: 6ch;
}
</style>
<body lang="en">
<p>Test passes if each black-bordered rectangles have identical inside content.
<div>regu-lation imple-menta-tion</div>
<div>regu-lation imple-menta-tion</div>

View file

@ -0,0 +1,27 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<title>CSS Reference Test</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style>
div
{
border: black solid 2px;
font-family: monospace;
font-size: 32px;
hyphens: none;
margin-bottom: 0.25em;
width: 10ch;
}
</style>
<body lang="en">
<p>Test passes if the characters inside of each black-bordered rectangles are laid out identically. Only "ucleic" should be outside of the black-bordered rectangles.
<div>Deoxyribonucleic acid</div>
<div>Deoxyribonucleic acid</div>

View file

@ -0,0 +1,27 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<title>CSS Reference Test</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style>
div
{
border: black solid 2px;
font-family: monospace;
font-size: 32px;
hyphens: none;
margin-bottom: 0.25em;
width: 10ch;
}
</style>
<body>
<p>Test passes if the characters inside of each black-bordered rectangles are laid out identically.
<div>Deoxyribo-nucleic acid</div>
<div>Deoxyribo-nucleic acid</div>

View file

@ -0,0 +1,27 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<title>CSS Reference Test</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style>
div
{
border: black solid 2px;
font-family: monospace;
font-size: 32px;
hyphens: none;
margin-bottom: 0.25em;
width: 10ch;
}
</style>
<body>
<p>Test passes if the characters inside of each black-bordered rectangles are laid out identically. Only the "c" of "nucleic" should be outside of each black-bordered rectangles.
<div>Deoxy-ribonucleic acid</div>
<div>Deoxy-ribonucleic acid</div>

View file

@ -0,0 +1,37 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<title>CSS Text: inline starting with a collapsible white space</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<link rel="help" href="https://www.w3.org/TR/css-text-3/#white-space-phase-2">
<link rel="match" href="../../reference/ref-filled-green-100px-square.xht">
<link rel="stylesheet" type="text/css" href="/fonts/ahem.css">
<style>
div
{
background-color: red;
color: green;
float: left;
font-family: Ahem;
font-size: 50px;
line-height: 1;
}
span#break-spaces
{
white-space: break-spaces;
}
</style>
<p>Test passes if there is a filled green square and <strong>no red</strong>.
<div><span id="break-spaces">AB&NewLine;</span><span> CD</span></div>
<!--
&NewLine; == Line feed == &#x000A; == &#0010;
-->

View file

@ -0,0 +1,37 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<title>CSS Text: inline starting with a collapsible white space</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<link rel="help" href="https://www.w3.org/TR/css-text-3/#white-space-phase-2">
<link rel="match" href="../../reference/ref-filled-green-100px-square.xht">
<link rel="stylesheet" type="text/css" href="/fonts/ahem.css">
<style>
div
{
background-color: red;
color: green;
display: inline-block;
font-family: Ahem;
font-size: 50px;
line-height: 1;
}
span#break-spaces
{
white-space: break-spaces;
}
</style>
<p>Test passes if there is a filled green square and <strong>no red</strong>.
<div><span id="break-spaces">AB&NewLine;</span><span> CD</span></div>
<!--
&NewLine; == Line feed == &#x000A; == &#0010;
-->

View file

@ -0,0 +1,37 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<title>CSS Text: inline starting with a collapsible white space</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<link rel="help" href="https://www.w3.org/TR/css-text-3/#white-space-phase-2">
<link rel="match" href="../../reference/ref-filled-green-100px-square.xht">
<link rel="stylesheet" type="text/css" href="/fonts/ahem.css">
<style>
div
{
background-color: red;
color: green;
float: left;
font-family: Ahem;
font-size: 50px;
line-height: 1;
}
span#pre-line
{
white-space: pre-line;
}
</style>
<p>Test passes if there is a filled green square and <strong>no red</strong>.
<div><span id="pre-line">AB&NewLine;</span><span> CD</span></div>
<!--
&NewLine; == Line feed == &#x000A; == &#0010;
-->

View file

@ -0,0 +1,37 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<title>CSS Text: inline starting with a collapsible white space</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<link rel="help" href="https://www.w3.org/TR/css-text-3/#white-space-phase-2">
<link rel="match" href="../../reference/ref-filled-green-100px-square.xht">
<link rel="stylesheet" type="text/css" href="/fonts/ahem.css">
<style>
div
{
background-color: red;
color: green;
display: inline-block;
font-family: Ahem;
font-size: 50px;
line-height: 1;
}
span#pre-line
{
white-space: pre-line;
}
</style>
<p>Test passes if there is a filled green square and <strong>no red</strong>.
<div><span id="pre-line">AB&NewLine;</span><span> CD</span></div>
<!--
&NewLine; == Line feed == &#x000A; == &#0010;
-->

View file

@ -0,0 +1,37 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<title>CSS Text: inline starting with a collapsible white space</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<link rel="help" href="https://www.w3.org/TR/css-text-3/#white-space-phase-2">
<link rel="match" href="../../reference/ref-filled-green-100px-square.xht">
<link rel="stylesheet" type="text/css" href="/fonts/ahem.css">
<style>
div
{
background-color: red;
color: green;
float: left;
font-family: Ahem;
font-size: 50px;
line-height: 1;
}
span#pre-wrap
{
white-space: pre-wrap;
}
</style>
<p>Test passes if there is a filled green square and <strong>no red</strong>.
<div><span id="pre-wrap">AB&NewLine;</span><span> CD</span></div>
<!--
&NewLine; == Line feed == &#x000A; == &#0010;
-->

View file

@ -0,0 +1,37 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<title>CSS Text: inline starting with a collapsible white space</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<link rel="help" href="https://www.w3.org/TR/css-text-3/#white-space-phase-2">
<link rel="match" href="../../reference/ref-filled-green-100px-square.xht">
<link rel="stylesheet" type="text/css" href="/fonts/ahem.css">
<style>
div
{
background-color: red;
color: green;
display: inline-block;
font-family: Ahem;
font-size: 50px;
line-height: 1;
}
span#pre-wrap
{
white-space: pre-wrap;
}
</style>
<p>Test passes if there is a filled green square and <strong>no red</strong>.
<div><span id="pre-wrap">AB&NewLine;</span><span> CD</span></div>
<!--
&NewLine; == Line feed == &#x000A; == &#0010;
-->

View file

@ -0,0 +1,31 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<title>CSS Reference Test</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style>
div
{
border: black solid 2px;
font-family: monospace;
font-size: 32px;
margin-bottom: 0.25em;
white-space: pre;
width: 16ch;
}
</style>
<body>
<p>Test passes if the characters inside of each black-bordered rectangles are laid out identically.
<div id="reference">Lorem ipsum.
Dolor sit amet.
consectetur</div>
<div id="reference">Lorem ipsum.
Dolor sit amet.
consectetur</div>

View file

@ -0,0 +1,28 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<title>CSS Reference Test</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style>
div
{
border: black solid 2px;
font-family: monospace;
font-size: 32px;
margin-bottom: 0.25em;
width: 16ch;
}
</style>
<body>
<p>Test passes if the characters inside of each black-bordered rectangles are laid out identically. Only "or sit amet." should be outside of black-bordered rectangles.
<div id="reference">Lorem&nbsp;ipsum.&nbsp;Dolor&nbsp;sit&nbsp;amet.<br>
consectetur</div>
<div id="reference">Lorem&nbsp;ipsum.&nbsp;Dolor&nbsp;sit&nbsp;amet.<br>
consectetur</div>

View file

@ -0,0 +1,30 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<title>CSS Reference Test</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style>
div
{
border: black solid 2px;
font-family: monospace;
font-size: 32px;
margin-bottom: 0.25em;
width: 16ch;
}
</style>
<body>
<p>Test passes if the characters inside of each black-bordered rectangles are laid out identically. Only "Dolor" should be outside of black-bordered rectangles.
<div id="reference">Lorem&nbsp;ipsum.&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Dolor<br>
&nbsp;&nbsp;&nbsp;sit&nbsp;&nbsp;amet.&nbsp;<br>
consectetur</div>
<div id="reference">Lorem&nbsp;ipsum.&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Dolor<br>
&nbsp;&nbsp;&nbsp;sit&nbsp;&nbsp;amet.&nbsp;<br>
consectetur</div>

View file

@ -0,0 +1,30 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<title>CSS Reference Test</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style>
div
{
border: black solid 2px;
font-family: monospace;
font-size: 32px;
margin-bottom: 0.25em;
width: 16ch;
}
</style>
<body>
<p>Test passes if the characters inside of each black-bordered rectangles are laid out identically.
<div>Lorem ipsum. <br>
Dolor<br>
&nbsp;&nbsp;&nbsp;sit&nbsp;&nbsp;amet.</div>
<div>Lorem ipsum. <br>
Dolor<br>
&nbsp;&nbsp;&nbsp;sit&nbsp;&nbsp;amet.</div>

View file

@ -0,0 +1,30 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<title>CSS Reference Test</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style>
div
{
border: black solid 2px;
font-family: monospace;
font-size: 32px;
margin-bottom: 0.25em;
width: 16ch;
}
</style>
<body>
<p>Test passes if the characters inside of each black-bordered rectangles are laid out identically.
<div>Lorem ipsum.&nbsp;&nbsp;&nbsp;&nbsp;<br>
&nbsp;&nbsp;Dolor<br>
&nbsp;&nbsp;&nbsp;sit&nbsp;&nbsp;amet.</div>
<div>Lorem ipsum.&nbsp;&nbsp;&nbsp;&nbsp;<br>
&nbsp;&nbsp;Dolor<br>
&nbsp;&nbsp;&nbsp;sit&nbsp;&nbsp;amet.</div>

View file

@ -0,0 +1,29 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<title>CSS Reference Test</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style>
div
{
border: black solid 2px;
font-family: monospace;
font-size: 32px;
margin-bottom: 0.25em;
white-space: pre;
width: 4ch;
}
</style>
<body>
<p>Test passes if the characters inside of each black-bordered rectangles are laid out identically.
<div>123
8</div>
<div>123
8</div>

View file

@ -0,0 +1,29 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<title>CSS Reference Test</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style>
li
{
border: black solid 2px;
font-family: monospace;
font-size: 32px;
margin-bottom: 0.25em;
white-space: pre;
width: 4ch;
}
</style>
<body>
<p>Test passes if the characters inside of each black-bordered rectangles (both preceded with a small filled disc) are laid out identically.
<ul><li>123
8</ul>
<ul><li>123
8</ul>

View file

@ -0,0 +1,35 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<title>CSS Reference Test</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style>
table
{
border: black solid 2px;
border-spacing: 0px;
font-family: monospace;
font-size: 32px;
margin-bottom: 0.25em;
white-space: pre;
width: 4ch;
}
td
{
padding: 0px;
}
</style>
<body>
<p>Test passes if the characters inside of each black-bordered rectangles are laid out identically.
<table><tr><td>123
8</table>
<table><tr><td>123
8</table>

View file

@ -0,0 +1,35 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<title>CSS Reference Test</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<style>
table
{
border: black solid 2px;
border-spacing: 0px;
font-family: monospace;
font-size: 32px;
margin-bottom: 0.25em;
}
td
{
padding: 0px;
width: 4ch;
white-space: normal;
}
</style>
<body>
<p>Test passes if the characters inside of each black-bordered rectangles are laid out identically.
<table><tr><td>123
8</table>
<table><tr><td>123
8</table>

View file

@ -0,0 +1,57 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<title>CSS Text: 'white-space: normal' (basic)</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<link rel="help" href="https://www.w3.org/TR/css-text-3/#white-space-property">
<link rel="match" href="reference/white-space-normal-011-ref.html">
<style>
div
{
border: black solid 2px;
font-family: monospace;
font-size: 32px;
margin-bottom: 0.25em;
width: 16ch;
}
div#test
{
white-space: normal;
}
div#reference
{
white-space: pre;
}
</style>
<p>Test passes if the characters inside of each black-bordered rectangles are laid out identically.
<div id="test">Lorem ipsum. Dolor
sit&Tab;amet. <br>consectetur</div>
<div id="reference">Lorem ipsum.
Dolor sit amet.
consectetur</div>
<!--
<div id="test">Lorem ipsum. Dolor
^^^^^^^^
12345678
sit&Tab;amet. <br>consectetur</div>
^^^
123
&Tab; == Horizontal tabulation == &#x0009; == &#09;
&NewLine; == Line feed == &#x000A; == &#0010;
-->

View file

@ -0,0 +1,55 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<title>CSS Text: 'white-space: nowrap' (basic)</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<link rel="help" href="https://www.w3.org/TR/css-text-3/#white-space-property">
<link rel="match" href="reference/white-space-nowrap-011-ref.html">
<style>
div
{
border: black solid 2px;
font-family: monospace;
font-size: 32px;
margin-bottom: 0.25em;
width: 16ch;
}
div#test
{
white-space: nowrap;
}
div#reference
{
white-space: normal;
}
</style>
<p>Test passes if the characters inside of each black-bordered rectangles are laid out identically. Only "or sit amet." should be outside of black-bordered rectangles.
<div id="test">Lorem ipsum. Dolor
sit&Tab;amet. <br>consectetur</div>
<div id="reference">Lorem&nbsp;ipsum.&nbsp;Dolor&nbsp;sit&nbsp;amet.<br>
consectetur</div>
<!--
<div id="test">Lorem ipsum. Dolor
^^^^^^^^
12345678
sit&Tab;amet. <br>consectetur</div>
^^^
123
&Tab; == Horizontal tabulation == &#x0009; == &#09;
&NewLine; == Line feed == &#x000A; == &#0010;
-->

View file

@ -0,0 +1,72 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<title>CSS Text: 'white-space: pre' (basic)</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<link rel="help" href="https://www.w3.org/TR/css-text-3/#white-space-property">
<link rel="match" href="reference/white-space-pre-011-ref.html">
<style>
div
{
border: black solid 2px;
font-family: monospace;
font-size: 32px;
margin-bottom: 0.25em;
width: 16ch;
}
div#test
{
white-space: pre;
}
div#reference
{
white-space: normal;
}
</style>
<p>Test passes if the characters inside of each black-bordered rectangles are laid out identically. Only "Dolor" should be outside of black-bordered rectangles.
<div id="test">Lorem ipsum. Dolor
sit&Tab;amet. <br>consectetur</div>
<div id="reference">Lorem&nbsp;ipsum.&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Dolor<br>
&nbsp;&nbsp;&nbsp;sit&nbsp;&nbsp;amet.&nbsp;<br>
consectetur</div>
<!--
<div id="test">Lorem ipsum. Dolor
^^^^^^^^
12345678
sit&Tab;amet. <br>consectetur</div>
^^^
123
Since 'tab-size' is by default 8,
since "sit" uses 3 characters
and since there are 3 white space characters
before "sit", then
8
-
3
-
3
=====
2
then the horizontal tabulation will be use as much space
as a sequence of 2 preserved white space characters.
&Tab; == Horizontal tabulation == &#x0009; == &#09;
&NewLine; == Line feed == &#x000A; == &#0010;
-->

View file

@ -0,0 +1,75 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<title>CSS Text: wrappable ('normal') inline inside a 'white-space: pre' block</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<link rel="help" href="https://www.w3.org/TR/css-text-3/#white-space-property">
<link rel="match" href="reference/white-space-pre-031-ref.html">
<style>
div
{
border: black solid 2px;
font-family: monospace;
font-size: 32px;
margin-bottom: 0.25em;
width: 16ch;
}
div#test
{
white-space: pre;
}
span
{
white-space: normal;
}
div#reference
{
white-space: normal;
}
</style>
<p>Test passes if the characters inside of each black-bordered rectangles are laid out identically.
<div id="test">Lorem ips<span>um. Dolo</span>r
sit&Tab;amet.</div>
<div id="reference">Lorem ipsum. <br>
Dolor<br>
&nbsp;&nbsp;&nbsp;sit&nbsp;&nbsp;amet.</div>
<!--
<div id="test">Lorem ipsum. Dolor
^
1
sit&Tab;amet.</div>
^^^
123
Since 'tab-size' is by default 8,
since "sit" uses 3 characters
and since there are 3 preserved
white space characters before "sit",
8
-
3
-
3
=====
2
then the horizontal tabulation will use as much space
as a sequence of 2 preserved white space characters.
&Tab; == Horizontal tabulation == &#x0009; == &#09;
-->

View file

@ -0,0 +1,76 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<title>CSS Text: wrappable ('pre-wrap') inline inside a 'white-space: pre' block</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<link rel="help" href="https://www.w3.org/TR/css-text-3/#white-space-property">
<link rel="match" href="reference/white-space-pre-031-ref.html">
<style>
div
{
border: black solid 2px;
font-family: monospace;
font-size: 32px;
margin-bottom: 0.25em;
width: 16ch;
}
div#test
{
white-space: pre;
}
span
{
white-space: pre-wrap;
}
div#reference
{
white-space: normal;
}
</style>
<p>Test passes if the characters inside of each black-bordered rectangles are laid out identically.
<div id="test">Lorem ips<span>um. Dolo</span>r
sit&Tab;amet.</div>
<div id="reference">Lorem ipsum. <br>
Dolor<br>
&nbsp;&nbsp;&nbsp;sit&nbsp;&nbsp;amet.</div>
<!--
<div id="test">Lorem ipsum. Dolor
^
1
sit&Tab;amet.</div>
^^^
123
Since 'tab-size' is by default 8,
since "sit" uses 3 characters
and since there are 3 preserved
white space characters before "sit",
8
-
3
-
3
=====
2
then the horizontal tabulation will be converted
into a sequence of 2 preserved white space characters.
&Tab; == Horizontal tabulation == &#x0009; == &#09;
-->

View file

@ -0,0 +1,76 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<title>CSS Text: wrappable ('break-spaces') inline inside a 'white-space: pre' block</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<link rel="help" href="https://www.w3.org/TR/css-text-3/#white-space-property">
<link rel="match" href="reference/white-space-pre-034-ref.html">
<style>
div
{
border: black solid 2px;
font-family: monospace;
font-size: 32px;
margin-bottom: 0.25em;
width: 16ch;
}
div#test
{
white-space: pre;
}
span
{
white-space: break-spaces;
}
div#reference
{
white-space: normal;
}
</style>
<p>Test passes if the characters inside of each black-bordered rectangles are laid out identically.
<div id="test">Lorem ips<span>um. Dolo</span>r
sit&Tab;amet.</div>
<div id="reference">Lorem ipsum.&nbsp;&nbsp;&nbsp;&nbsp;<br>
&nbsp;&nbsp;Dolor<br>
&nbsp;&nbsp;&nbsp;sit&nbsp;&nbsp;amet.</div>
<!--
<div id="test">Lorem ipsum. Dolor
^^^^^^
123456
sit&Tab;amet.</div>
^^^
123
Since 'tab-size' is by default 8,
since "sit" uses 3 characters
and since there are 3 preserved
white space characters before "sit",
8
-
3
-
3
=====
2
then the horizontal tabulation will use as much space
as a sequence of 2 preserved white space characters.
&Tab; == Horizontal tabulation == &#x0009; == &#09;
-->

View file

@ -0,0 +1,76 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<title>CSS Text: wrappable ('pre-line') inline inside a 'white-space: pre' block</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<link rel="help" href="https://www.w3.org/TR/css-text-3/#white-space-property">
<link rel="match" href="reference/white-space-pre-031-ref.html">
<style>
div
{
border: black solid 2px;
font-family: monospace;
font-size: 32px;
margin-bottom: 0.25em;
width: 16ch;
}
div#test
{
white-space: pre;
}
span
{
white-space: pre-line;
}
div#reference
{
white-space: normal;
}
</style>
<p>Test passes if the characters inside of each black-bordered rectangles are laid out identically.
<div id="test">Lorem ips<span>um. Dolo</span>r
sit&Tab;amet.</div>
<div id="reference">Lorem ipsum. <br>
Dolor<br>
&nbsp;&nbsp;&nbsp;sit&nbsp;&nbsp;amet.</div>
<!--
<div id="test">Lorem ipsum. Dolor
^^^^^^
123456
sit&Tab;amet.</div>
^^^
123
Since 'tab-size' is by default 8,
since "sit" uses 3 characters
and since there are 3 preserved
white space characters before "sit",
8
-
3
-
3
=====
2
then the horizontal tabulation will be converted
into a sequence of 2 preserved white space characters.
&Tab; == Horizontal tabulation == &#x0009; == &#09;
-->

View file

@ -0,0 +1,45 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<title>CSS Text: inline starting with a collapsible white space</title>
<!--
Same as
http://test.csswg.org/suites/css-text-3_dev/nightly-unstable/html/white-space-mixed-003.htm
but more compact
-->
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<link rel="help" href="https://www.w3.org/TR/css-text-3/#white-space-phase-2">
<link rel="match" href="../../reference/ref-filled-green-100px-square.xht">
<link rel="stylesheet" type="text/css" href="/fonts/ahem.css">
<style>
div
{
background-color: red;
color: green;
float: left;
font-family: Ahem;
font-size: 50px;
line-height: 1;
}
span#pre
{
white-space: pre;
}
</style>
<p>Test passes if there is a filled green square and <strong>no red</strong>.
<div><span id="pre">AB&NewLine;</span><span> CD</span></div>
<!--
&NewLine; == Line feed == &#x000A; == &#0010;
-->

View file

@ -0,0 +1,45 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<title>CSS Text: inline starting with a collapsible white space</title>
<!--
Same as
http://test.csswg.org/suites/css-text-3_dev/nightly-unstable/html/white-space-mixed-003.htm
but more compact
-->
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<link rel="help" href="https://www.w3.org/TR/css-text-3/#white-space-phase-2">
<link rel="match" href="../../reference/ref-filled-green-100px-square.xht">
<link rel="stylesheet" type="text/css" href="/fonts/ahem.css">
<style>
div
{
background-color: red;
color: green;
display: inline-block;
font-family: Ahem;
font-size: 50px;
line-height: 1;
}
span#pre
{
white-space: pre;
}
</style>
<p>Test passes if there is a filled green square and <strong>no red</strong>.
<div><span id="pre">AB&NewLine;</span><span> CD</span></div>
<!--
&NewLine; == Line feed == &#x000A; == &#0010;
-->

View file

@ -1,35 +0,0 @@
<!doctype html>
<meta charset=utf-8>
<title>CSS Text test: hanging trailing spaces with white-space:pre-wrap</title>
<link rel="author" title="Javier Fernandez" href="mailto:jfernandez@igalia.com">
<link rel="help" title="3. White Space and Wrapping: the white-space property" href="https://drafts.csswg.org/css-text-3/#white-space-property">
<link rel="help" href="https://drafts.csswg.org/css-text-3/#valdef-white-space-pre-wrap">
<link rel="help" title="4.1.3. Phase II: Trimming and Positioning" href="https://drafts.csswg.org/css-text-3/#white-space-phase-2">
<link rel="help" title="5.5. Overflow Wrapping: the overflow-wrap/word-wrap property" href="https://drafts.csswg.org/css-text-3/#overflow-wrap-property">
<link rel="help" href="https://drafts.csswg.org/css-text-3/#valdef-overflow-wrap-anywhere">
<link rel="match" href="reference/white-space-pre-wrap-trailing-spaces-004-ref.html">
<meta name="assert" content="Preserved white space at the end of a soft-wrapped line is hanged when white-space is pre-wrap.">
<link rel="stylesheet" type="text/css" href="/fonts/ahem.css">
<style>
div {
font: 10px/1 Ahem;
}
.ref {
position: absolute;
color: red;
z-index: -1;
}
.ref span { color: green; }
.test {
color: green;
width: 5ch;
white-space: pre-wrap;
overflow-wrap: anywhere;
}
</style>
<p>This test passes if there is a green square and no red.
<div class="ref">XX<span>XXX</span><br>X<span>XX</span>X<span>X</span><br><span>XXXXX</span><br><span>XXXXX</span><br><span>XXXXX</span></div>
<div class="test">XX<span> </span><span>X X </span></div>

View file

@ -18,7 +18,7 @@ div {
width: 2ch;
white-space: pre-wrap;
overflow-wrap: break-word;
word-break: break-all;
}
</style>

View file

@ -25,7 +25,7 @@ div {
width: 5ch;
white-space: pre-wrap;
overflow-wrap: break-word;
word-break: break-all;
}
</style>

View file

@ -0,0 +1,78 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<title>CSS Text Test: 'white-space: break-spaces' applies to 'display: inline' element</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<link rel="help" href="https://www.w3.org/TR/css-text-3/#white-space-property">
<link rel="match" href="reference/ws-break-spaces-applies-to-001-ref.html">
<meta content="" name="flags">
<meta content="When 'white-space' is 'break-spaces', then new lines, sequence of white spaces and tabs are preserved and text can wrap, just like pre-wrap, but sequence of preserved white space always takes up space, including at the end of the line and line breaking opportunity exists after every preserved white space character, including between white space characters. In this test, 'display: inline' is tested." name="assert">
<!--
Testing of 'white-space: break-spaces':
ws-break-spaces-applies-to-001: display: inline
ws-break-spaces-applies-to-002: display: block
ws-break-spaces-applies-to-003: display: list-item
ws-break-spaces-applies-to-005: display: inline-block
ws-break-spaces-applies-to-006: display: table
ws-break-spaces-applies-to-007: display: inline-table
ws-break-spaces-applies-to-008: display: table-row-group
ws-break-spaces-applies-to-009: display: table-header-group
ws-break-spaces-applies-to-010: display: table-footer-group
ws-break-spaces-applies-to-011: display: table-row
ws-break-spaces-applies-to-012: display: table-column-group
ws-break-spaces-applies-to-013: display: table-column
ws-break-spaces-applies-to-014: display: table-cell
ws-break-spaces-applies-to-015: display: table-caption
-->
<style>
div#wrapper, div#reference
{
border: black solid 2px;
font-family: monospace;
font-size: 32px;
margin-bottom: 0.25em;
width: 4ch;
}
div#test
{
display: inline;
white-space: break-spaces;
}
div#reference
{
white-space: pre;
}
</style>
<p>Test passes if the characters inside of each black-bordered rectangles are laid out identically.
<div id="wrapper"><div id="test">123 8</div></div>
<!-- 45678 -->
<!-- will wrap here ^ -->
<div id="reference">123
8</div>

View file

@ -0,0 +1,76 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<title>CSS Text Test: 'white-space: break-spaces' applies to 'display: block' element</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<link rel="help" href="https://www.w3.org/TR/css-text-3/#white-space-property">
<link rel="match" href="reference/ws-break-spaces-applies-to-001-ref.html">
<meta content="" name="flags">
<meta content="When 'white-space' is 'break-spaces', then new lines, sequence of white spaces and tabs are preserved and text can wrap, just like pre-wrap, but sequence of preserved white space always takes up space, including at the end of the line and line breaking opportunity exists after every preserved white space character, including between white space characters. In this test, 'display: block' is tested." name="assert">
<!--
Testing of 'white-space: break-spaces':
ws-break-spaces-applies-to-001: display: inline
ws-break-spaces-applies-to-002: display: block
ws-break-spaces-applies-to-003: display: list-item
ws-break-spaces-applies-to-005: display: inline-block
ws-break-spaces-applies-to-006: display: table
ws-break-spaces-applies-to-007: display: inline-table
ws-break-spaces-applies-to-008: display: table-row-group
ws-break-spaces-applies-to-009: display: table-header-group
ws-break-spaces-applies-to-010: display: table-footer-group
ws-break-spaces-applies-to-011: display: table-row
ws-break-spaces-applies-to-012: display: table-column-group
ws-break-spaces-applies-to-013: display: table-column
ws-break-spaces-applies-to-014: display: table-cell
ws-break-spaces-applies-to-015: display: table-caption
-->
<style>
div
{
border: black solid 2px;
font-family: monospace;
font-size: 32px;
margin-bottom: 0.25em;
width: 4ch;
}
div#test
{
display: block;
white-space: break-spaces;
}
div#reference
{
white-space: pre;
}
</style>
<p>Test passes if the characters inside of each black-bordered rectangles are laid out identically.
<div id="test">123 8</div>
<!-- 45678 -->
<!-- will wrap here ^ -->
<div id="reference">123
8</div>

View file

@ -0,0 +1,78 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<title>CSS Text Test: 'white-space: break-spaces' applies to 'display: list-item' element</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<link rel="help" href="https://www.w3.org/TR/css-text-3/#white-space-property">
<link rel="match" href="reference/ws-break-spaces-applies-to-003-ref.html">
<meta content="" name="flags">
<meta content="When 'white-space' is 'break-spaces', then new lines, sequence of white spaces and tabs are preserved and text can wrap, just like pre-wrap, but sequence of preserved white space always takes up space, including at the end of the line and line breaking opportunity exists after every preserved white space character, including between white space characters. In this test, 'display: list-item' is tested." name="assert">
<!--
Testing of 'white-space: break-spaces':
ws-break-spaces-applies-to-001: display: inline
ws-break-spaces-applies-to-002: display: block
ws-break-spaces-applies-to-003: display: list-item
ws-break-spaces-applies-to-005: display: inline-block
ws-break-spaces-applies-to-006: display: table
ws-break-spaces-applies-to-007: display: inline-table
ws-break-spaces-applies-to-008: display: table-row-group
ws-break-spaces-applies-to-009: display: table-header-group
ws-break-spaces-applies-to-010: display: table-footer-group
ws-break-spaces-applies-to-011: display: table-row
ws-break-spaces-applies-to-012: display: table-column-group
ws-break-spaces-applies-to-013: display: table-column
ws-break-spaces-applies-to-014: display: table-cell
ws-break-spaces-applies-to-015: display: table-caption
-->
<style>
div#test, li#reference
{
border: black solid 2px;
font-family: monospace;
font-size: 32px;
margin-bottom: 0.25em;
width: 4ch;
}
div#test
{
display: list-item;
margin-left: 40px;
white-space: break-spaces;
}
li#reference
{
white-space: pre;
}
</style>
<p>Test passes if the characters inside of each black-bordered rectangles (both preceded with a small filled disc) are laid out identically.
<div id="test">123 8</div>
<!-- 45678 -->
<!-- will wrap here ^ -->
<ul><li id="reference">123
8</ul>

View file

@ -0,0 +1,77 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<title>CSS Text Test: 'white-space: break-spaces' applies to 'display: inline-block' element</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<link rel="help" href="https://www.w3.org/TR/css-text-3/#white-space-property">
<link rel="match" href="reference/ws-break-spaces-applies-to-001-ref.html">
<meta content="" name="flags">
<meta content="When 'white-space' is 'break-spaces', then new lines, sequence of white spaces and tabs are preserved and text can wrap, just like pre-wrap, but sequence of preserved white space always takes up space, including at the end of the line and line breaking opportunity exists after every preserved white space character, including between white space characters. In this test, 'display: inline-block' is tested." name="assert">
<!--
Testing of 'white-space: break-spaces':
ws-break-spaces-applies-to-001: display: inline
ws-break-spaces-applies-to-002: display: block
ws-break-spaces-applies-to-003: display: list-item
ws-break-spaces-applies-to-005: display: inline-block
ws-break-spaces-applies-to-006: display: table
ws-break-spaces-applies-to-007: display: inline-table
ws-break-spaces-applies-to-008: display: table-row-group
ws-break-spaces-applies-to-009: display: table-header-group
ws-break-spaces-applies-to-010: display: table-footer-group
ws-break-spaces-applies-to-011: display: table-row
ws-break-spaces-applies-to-012: display: table-column-group
ws-break-spaces-applies-to-013: display: table-column
ws-break-spaces-applies-to-014: display: table-cell
ws-break-spaces-applies-to-015: display: table-caption
-->
<style>
div
{
border: black solid 2px;
font-family: monospace;
font-size: 32px;
margin-bottom: 0.25em;
width: 4ch;
}
div#test
{
display: inline-block;
white-space: break-spaces;
}
div#reference
{
white-space: pre;
}
</style>
<p>Test passes if the characters inside of each black-bordered rectangles are laid out identically.
<div id="test">123 8</div>
<!-- 45678 -->
<!-- will wrap here ^ -->
<div id="reference">123
8</div>

View file

@ -0,0 +1,97 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<title>CSS Text Test: 'white-space: break-spaces' applies to 'display: table' element</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<link rel="help" href="https://www.w3.org/TR/css-text-3/#white-space-property">
<link rel="match" href="reference/ws-break-spaces-applies-to-006-ref.html">
<meta content="" name="flags">
<meta content="When 'white-space' is 'break-spaces', then new lines, sequence of white spaces and tabs are preserved and text can wrap, just like pre-wrap, but sequence of preserved white space always takes up space, including at the end of the line and line breaking opportunity exists after every preserved white space character, including between white space characters. In this test, 'display: table' is tested." name="assert">
<!--
Testing of 'white-space: break-spaces':
ws-break-spaces-applies-to-001: display: inline
ws-break-spaces-applies-to-002: display: block
ws-break-spaces-applies-to-003: display: list-item
ws-break-spaces-applies-to-005: display: inline-block
ws-break-spaces-applies-to-006: display: table
ws-break-spaces-applies-to-007: display: inline-table
ws-break-spaces-applies-to-008: display: table-row-group
ws-break-spaces-applies-to-009: display: table-header-group
ws-break-spaces-applies-to-010: display: table-footer-group
ws-break-spaces-applies-to-011: display: table-row
ws-break-spaces-applies-to-012: display: table-column-group
ws-break-spaces-applies-to-013: display: table-column
ws-break-spaces-applies-to-014: display: table-cell
ws-break-spaces-applies-to-015: display: table-caption
-->
<style>
div#test, table#reference
{
border: black solid 2px;
font-family: monospace;
font-size: 32px;
margin-bottom: 0.25em;
width: 4ch;
}
div#test
{
display: table;
white-space: break-spaces;
}
div#row
{
display: table-row;
}
div#cell
{
display: table-cell;
}
table#reference
{
border-spacing: 0px;
white-space: pre;
}
td
{
padding: 0px;
}
</style>
<p>Test passes if the characters inside of each black-bordered rectangles are laid out identically.
<div id="test">
<div id="row">
<div id="cell">123 8</div>
<!-- 45678 -->
<!-- will wrap here ^ -->
</div>
</div>
<table id="reference"><tr><td>123
8</table>

View file

@ -0,0 +1,97 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<title>CSS Text Test: 'white-space: break-spaces' applies to 'display: inline-table' element</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<link rel="help" href="https://www.w3.org/TR/css-text-3/#white-space-property">
<link rel="match" href="reference/ws-break-spaces-applies-to-006-ref.html">
<meta content="" name="flags">
<meta content="When 'white-space' is 'break-spaces', then new lines, sequence of white spaces and tabs are preserved and text can wrap, just like pre-wrap, but sequence of preserved white space always takes up space, including at the end of the line and line breaking opportunity exists after every preserved white space character, including between white space characters. In this test, 'display: inline-table' is tested." name="assert">
<!--
Testing of 'white-space: break-spaces':
ws-break-spaces-applies-to-001: display: inline
ws-break-spaces-applies-to-002: display: block
ws-break-spaces-applies-to-003: display: list-item
ws-break-spaces-applies-to-005: display: inline-block
ws-break-spaces-applies-to-006: display: table
ws-break-spaces-applies-to-007: display: inline-table
ws-break-spaces-applies-to-008: display: table-row-group
ws-break-spaces-applies-to-009: display: table-header-group
ws-break-spaces-applies-to-010: display: table-footer-group
ws-break-spaces-applies-to-011: display: table-row
ws-break-spaces-applies-to-012: display: table-column-group
ws-break-spaces-applies-to-013: display: table-column
ws-break-spaces-applies-to-014: display: table-cell
ws-break-spaces-applies-to-015: display: table-caption
-->
<style>
div#test, table
{
border: black solid 2px;
font-family: monospace;
font-size: 32px;
margin-bottom: 0.25em;
width: 4ch;
}
div#test
{
display: inline-table;
white-space: break-spaces;
}
div#row
{
display: table-row;
}
div#cell
{
display: table-cell;
}
table#reference
{
border-spacing: 0px;
white-space: pre;
}
td
{
padding: 0px;
}
</style>
<p>Test passes if the characters inside of each black-bordered rectangles are laid out identically.
<div id="test">
<div id="row">
<div id="cell">123 8</div>
<!-- 45678 -->
<!-- will wrap here ^ -->
</div>
</div>
<table id="reference"><tr><td>123
8</table>

View file

@ -0,0 +1,105 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<title>CSS Text Test: 'white-space: break-spaces' applies to 'display: table-row-group' element</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<link rel="help" href="https://www.w3.org/TR/css-text-3/#white-space-property">
<link rel="match" href="reference/ws-break-spaces-applies-to-006-ref.html">
<meta content="" name="flags">
<meta content="When 'white-space' is 'break-spaces', then new lines, sequence of white spaces and tabs are preserved and text can wrap, just like pre-wrap, but sequence of preserved white space always takes up space, including at the end of the line and line breaking opportunity exists after every preserved white space character, including between white space characters. In this test, 'display: table-row-group' is tested." name="assert">
<!--
Testing of 'white-space: break-spaces':
ws-break-spaces-applies-to-001: display: inline
ws-break-spaces-applies-to-002: display: block
ws-break-spaces-applies-to-003: display: list-item
ws-break-spaces-applies-to-005: display: inline-block
ws-break-spaces-applies-to-006: display: table
ws-break-spaces-applies-to-007: display: inline-table
ws-break-spaces-applies-to-008: display: table-row-group
ws-break-spaces-applies-to-009: display: table-header-group
ws-break-spaces-applies-to-010: display: table-footer-group
ws-break-spaces-applies-to-011: display: table-row
ws-break-spaces-applies-to-012: display: table-column-group
ws-break-spaces-applies-to-013: display: table-column
ws-break-spaces-applies-to-014: display: table-cell
ws-break-spaces-applies-to-015: display: table-caption
-->
<style>
div#cell, td#reference
{
border: black solid 2px;
font-family: monospace;
font-size: 32px;
width: 4ch;
}
div#table
{
display: table;
}
div#test
{
display: table-row-group;
white-space: break-spaces;
}
div#row
{
display: table-row;
}
div#cell
{
display: table-cell;
width: 4ch;
}
table
{
border-spacing: 0px;
margin-top: 0.5em;
}
td#reference
{
padding: 0px;
white-space: pre;
}
</style>
<p>Test passes if the characters inside of each black-bordered rectangles are laid out identically.
<div id="table">
<div id="test">
<div id="row">
<div id="cell">123 8</div>
<!-- 45678 -->
<!-- will wrap here ^ -->
</div>
</div>
</div>
<table><tbody><tr><td id="reference">123
8</table>

View file

@ -0,0 +1,105 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<title>CSS Text Test: 'white-space: break-spaces' applies to 'display: table-header-group' element</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<link rel="help" href="https://www.w3.org/TR/css-text-3/#white-space-property">
<link rel="match" href="reference/ws-break-spaces-applies-to-006-ref.html">
<meta content="" name="flags">
<meta content="When 'white-space' is 'break-spaces', then new lines, sequence of white spaces and tabs are preserved and text can wrap, just like pre-wrap, but sequence of preserved white space always takes up space, including at the end of the line and line breaking opportunity exists after every preserved white space character, including between white space characters. In this test, 'display: table-header-group' is tested." name="assert">
<!--
Testing of 'white-space: break-spaces':
ws-break-spaces-applies-to-001: display: inline
ws-break-spaces-applies-to-002: display: block
ws-break-spaces-applies-to-003: display: list-item
ws-break-spaces-applies-to-005: display: inline-block
ws-break-spaces-applies-to-006: display: table
ws-break-spaces-applies-to-007: display: inline-table
ws-break-spaces-applies-to-008: display: table-row-group
ws-break-spaces-applies-to-009: display: table-header-group
ws-break-spaces-applies-to-010: display: table-footer-group
ws-break-spaces-applies-to-011: display: table-row
ws-break-spaces-applies-to-012: display: table-column-group
ws-break-spaces-applies-to-013: display: table-column
ws-break-spaces-applies-to-014: display: table-cell
ws-break-spaces-applies-to-015: display: table-caption
-->
<style>
div#cell, td#reference
{
border: black solid 2px;
font-family: monospace;
font-size: 32px;
width: 4ch;
}
div#table
{
display: table;
}
div#test
{
display: table-header-group;
white-space: break-spaces;
}
div#row
{
display: table-row;
}
div#cell
{
display: table-cell;
width: 4ch;
}
table
{
border-spacing: 0px;
margin-top: 0.5em;
}
td#reference
{
padding: 0px;
white-space: pre;
}
</style>
<p>Test passes if the characters inside of each black-bordered rectangles are laid out identically.
<div id="table">
<div id="test">
<div id="row">
<div id="cell">123 8</div>
<!-- 45678 -->
<!-- will wrap here ^ -->
</div>
</div>
</div>
<table><thead><tr><td id="reference">123
8</table>

View file

@ -0,0 +1,105 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<title>CSS Text Test: 'white-space: break-spaces' applies to 'display: table-footer-group' element</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<link rel="help" href="https://www.w3.org/TR/css-text-3/#white-space-property">
<link rel="match" href="reference/ws-break-spaces-applies-to-006-ref.html">
<meta content="" name="flags">
<meta content="When 'white-space' is 'break-spaces', then new lines, sequence of white spaces and tabs are preserved and text can wrap, just like pre-wrap, but sequence of preserved white space always takes up space, including at the end of the line and line breaking opportunity exists after every preserved white space character, including between white space characters. In this test, 'display: table-footer-group' is tested." name="assert">
<!--
Testing of 'white-space: break-spaces':
ws-break-spaces-applies-to-001: display: inline
ws-break-spaces-applies-to-002: display: block
ws-break-spaces-applies-to-003: display: list-item
ws-break-spaces-applies-to-005: display: inline-block
ws-break-spaces-applies-to-006: display: table
ws-break-spaces-applies-to-007: display: inline-table
ws-break-spaces-applies-to-008: display: table-row-group
ws-break-spaces-applies-to-009: display: table-header-group
ws-break-spaces-applies-to-010: display: table-footer-group
ws-break-spaces-applies-to-011: display: table-row
ws-break-spaces-applies-to-012: display: table-column-group
ws-break-spaces-applies-to-013: display: table-column
ws-break-spaces-applies-to-014: display: table-cell
ws-break-spaces-applies-to-015: display: table-caption
-->
<style>
div#cell, td#reference
{
border: black solid 2px;
font-family: monospace;
font-size: 32px;
width: 4ch;
}
div#table
{
display: table;
}
div#test
{
display: table-footer-group;
white-space: break-spaces;
}
div#row
{
display: table-row;
}
div#cell
{
display: table-cell;
width: 4ch;
}
table
{
border-spacing: 0px;
margin-top: 0.5em;
}
td#reference
{
padding: 0px;
white-space: pre;
}
</style>
<p>Test passes if the characters inside of each black-bordered rectangles are laid out identically.
<div id="table">
<div id="test">
<div id="row">
<div id="cell">123 8</div>
<!-- 45678 -->
<!-- will wrap here ^ -->
</div>
</div>
</div>
<table><tfoot><tr><td id="reference">123
8</table>

View file

@ -0,0 +1,98 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<title>CSS Text Test: 'white-space: break-spaces' applies to 'display: table-row' element</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<link rel="help" href="https://www.w3.org/TR/css-text-3/#white-space-property">
<link rel="match" href="reference/ws-break-spaces-applies-to-006-ref.html">
<meta content="" name="flags">
<meta content="When 'white-space' is 'break-spaces', then new lines, sequence of white spaces and tabs are preserved and text can wrap, just like pre-wrap, but sequence of preserved white space always takes up space, including at the end of the line and line breaking opportunity exists after every preserved white space character, including between white space characters. In this test, 'display: table-row' is tested." name="assert">
<!--
Testing of 'white-space: break-spaces':
ws-break-spaces-applies-to-001: display: inline
ws-break-spaces-applies-to-002: display: block
ws-break-spaces-applies-to-003: display: list-item
ws-break-spaces-applies-to-005: display: inline-block
ws-break-spaces-applies-to-006: display: table
ws-break-spaces-applies-to-007: display: inline-table
ws-break-spaces-applies-to-008: display: table-row-group
ws-break-spaces-applies-to-009: display: table-header-group
ws-break-spaces-applies-to-010: display: table-footer-group
ws-break-spaces-applies-to-011: display: table-row
ws-break-spaces-applies-to-012: display: table-column-group
ws-break-spaces-applies-to-013: display: table-column
ws-break-spaces-applies-to-014: display: table-cell
ws-break-spaces-applies-to-015: display: table-caption
-->
<style>
div#cell, td#reference
{
border: black solid 2px;
font-family: monospace;
font-size: 32px;
width: 4ch;
}
div#table
{
display: table;
}
div#test
{
display: table-row;
white-space: break-spaces;
}
div#cell
{
display: table-cell;
width: 4ch;
}
table
{
border-spacing: 0px;
margin-top: 0.5em;
}
td#reference
{
padding: 0px;
white-space: pre;
}
</style>
<p>Test passes if the characters inside of each black-bordered rectangles are laid out identically.
<div id="table">
<div id="test">
<div id="cell">123 8</div>
<!-- 45678 -->
<!-- will wrap here ^ -->
</div>
</div>
<table><tr><td id="reference">123
8</table>

View file

@ -0,0 +1,103 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<title>CSS Text Test: 'white-space: break-spaces' does not apply to 'display: table-column-group' element</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<link rel="help" href="https://www.w3.org/TR/css-text-3/#white-space-property">
<link rel="match" href="reference/ws-break-spaces-applies-to-012-ref.html">
<meta content="" name="flags">
<meta content="In this test, we verify that 'white-space: break-spaces' does not apply to element with 'display: table-column-group'." name="assert">
<!--
Testing of 'white-space: break-spaces':
ws-break-spaces-applies-to-001: display: inline
ws-break-spaces-applies-to-002: display: block
ws-break-spaces-applies-to-003: display: list-item
ws-break-spaces-applies-to-005: display: inline-block
ws-break-spaces-applies-to-006: display: table
ws-break-spaces-applies-to-007: display: inline-table
ws-break-spaces-applies-to-008: display: table-row-group
ws-break-spaces-applies-to-009: display: table-header-group
ws-break-spaces-applies-to-010: display: table-footer-group
ws-break-spaces-applies-to-011: display: table-row
ws-break-spaces-applies-to-012: display: table-column-group
ws-break-spaces-applies-to-013: display: table-column
ws-break-spaces-applies-to-014: display: table-cell
ws-break-spaces-applies-to-015: display: table-caption
-->
<style>
div#cell, td#reference
{
border: black solid 2px;
font-family: monospace;
font-size: 32px;
width: 4ch;
}
div#table
{
display: table;
}
div#test
{
display: table-column-group;
white-space: break-spaces;
}
div#row
{
display: table-row;
}
div#cell
{
display: table-cell;
}
table
{
border-spacing: 0px;
margin-top: 0.5em;
}
td#reference
{
padding: 0px;
white-space: normal;
}
</style>
<p>Test passes if the characters inside of each black-bordered rectangles are laid out identically.
<div id="table">
<div id="test"></div>
<div id="row">
<div id="cell">123 8</div>
<!-- 45678 -->
<!-- will wrap here ^ -->
</div>
</div>
<table><tr><td id="reference">123
8</table>

View file

@ -0,0 +1,103 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<title>CSS Text Test: 'white-space: break-spaces' does not apply to 'display: table-column' element</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<link rel="help" href="https://www.w3.org/TR/css-text-3/#white-space-property">
<link rel="match" href="reference/ws-break-spaces-applies-to-012-ref.html">
<meta content="" name="flags">
<meta content="In this test, we verify that 'white-space: break-spaces' does not apply to element with 'display: table-column'." name="assert">
<!--
Testing of 'white-space: break-spaces':
ws-break-spaces-applies-to-001: display: inline
ws-break-spaces-applies-to-002: display: block
ws-break-spaces-applies-to-003: display: list-item
ws-break-spaces-applies-to-005: display: inline-block
ws-break-spaces-applies-to-006: display: table
ws-break-spaces-applies-to-007: display: inline-table
ws-break-spaces-applies-to-008: display: table-row-group
ws-break-spaces-applies-to-009: display: table-header-group
ws-break-spaces-applies-to-010: display: table-footer-group
ws-break-spaces-applies-to-011: display: table-row
ws-break-spaces-applies-to-012: display: table-column-group
ws-break-spaces-applies-to-013: display: table-column
ws-break-spaces-applies-to-014: display: table-cell
ws-break-spaces-applies-to-015: display: table-caption
-->
<style>
div#cell, td#reference
{
border: black solid 2px;
font-family: monospace;
font-size: 32px;
width: 4ch;
}
div#table
{
display: table;
}
div#test
{
display: table-column;
white-space: break-spaces;
}
div#row
{
display: table-row;
}
div#cell
{
display: table-cell;
}
table
{
border-spacing: 0px;
margin-top: 0.5em;
}
td#reference
{
padding: 0px;
white-space: normal;
}
</style>
<p>Test passes if the characters inside of each black-bordered rectangles are laid out identically.
<div id="table">
<div id="test"></div>
<div id="row">
<div id="cell">123 8</div>
<!-- 45678 -->
<!-- will wrap here ^ -->
</div>
</div>
<table><tr><td id="reference">123
8</table>

View file

@ -0,0 +1,97 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<title>CSS Text Test: 'white-space: break-spaces' applies to 'display: table-cell' element</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<link rel="help" href="https://www.w3.org/TR/css-text-3/#white-space-property">
<link rel="match" href="reference/ws-break-spaces-applies-to-006-ref.html">
<meta content="" name="flags">
<meta content="When 'white-space' is 'break-spaces', then new lines, sequence of white spaces and tabs are preserved and text can wrap, just like pre-wrap, but sequence of preserved white space always takes up space, including at the end of the line and line breaking opportunity exists after every preserved white space character, including between white space characters. In this test, 'display: table-cell' is tested." name="assert">
<!--
Testing of 'white-space: break-spaces':
ws-break-spaces-applies-to-001: display: inline
ws-break-spaces-applies-to-002: display: block
ws-break-spaces-applies-to-003: display: list-item
ws-break-spaces-applies-to-005: display: inline-block
ws-break-spaces-applies-to-006: display: table
ws-break-spaces-applies-to-007: display: inline-table
ws-break-spaces-applies-to-008: display: table-row-group
ws-break-spaces-applies-to-009: display: table-header-group
ws-break-spaces-applies-to-010: display: table-footer-group
ws-break-spaces-applies-to-011: display: table-row
ws-break-spaces-applies-to-012: display: table-column-group
ws-break-spaces-applies-to-013: display: table-column
ws-break-spaces-applies-to-014: display: table-cell
ws-break-spaces-applies-to-015: display: table-caption
-->
<style>
div#test, td#reference
{
border: black solid 2px;
font-family: monospace;
font-size: 32px;
width: 4ch;
}
div#table
{
display: table;
}
div#row
{
display: table-row;
}
div#test
{
display: table-cell;
white-space: break-spaces;
}
table
{
border-spacing: 0px;
margin-top: 0.5em;
}
td#reference
{
padding: 0px;
white-space: pre;
}
</style>
<p>Test passes if the characters inside of each black-bordered rectangles are laid out identically.
<div id="table">
<div id="row">
<div id="test">123 8</div>
<!-- 45678 -->
<!-- will wrap here ^ -->
</div>
</div>
<table><tr><td id="reference">123
8</table>

View file

@ -0,0 +1,89 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<title>CSS Text Test: 'white-space: break-spaces' applies to 'display: table-caption' element</title>
<link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/">
<link rel="help" href="https://www.w3.org/TR/css-text-3/#white-space-property">
<link rel="match" href="reference/ws-break-spaces-applies-to-001-ref.html">
<meta content="" name="flags">
<meta content="When 'white-space' is 'break-spaces', then new lines, sequence of white spaces and tabs are preserved and text can wrap, just like pre-wrap, but sequence of preserved white space always takes up space, including at the end of the line and line breaking opportunity exists after every preserved white space character, including between white space characters. In this test, 'display: table-caption' is tested." name="assert">
<!--
Testing of 'white-space: break-spaces':
ws-break-spaces-applies-to-001: display: inline
ws-break-spaces-applies-to-002: display: block
ws-break-spaces-applies-to-003: display: list-item
ws-break-spaces-applies-to-005: display: inline-block
ws-break-spaces-applies-to-006: display: table
ws-break-spaces-applies-to-007: display: inline-table
ws-break-spaces-applies-to-008: display: table-row-group
ws-break-spaces-applies-to-009: display: table-header-group
ws-break-spaces-applies-to-010: display: table-footer-group
ws-break-spaces-applies-to-011: display: table-row
ws-break-spaces-applies-to-012: display: table-column-group
ws-break-spaces-applies-to-013: display: table-column
ws-break-spaces-applies-to-014: display: table-cell
ws-break-spaces-applies-to-015: display: table-caption
-->
<style>
div#test, caption#reference
{
border: black solid 2px;
font-family: monospace;
font-size: 32px;
width: 4ch;
}
div#table
{
display: table;
}
div#test
{
display: table-caption;
white-space: break-spaces;
}
table
{
margin-top: 0.5em;
}
caption#reference
{
text-align: left;
white-space: pre;
}
</style>
<p>Test passes if the characters inside of each black-bordered rectangles are laid out identically.
<div id="table">
<div id="test">123 8</div>
<!-- 45678 -->
<!-- will wrap here ^ -->
</div>
<table><caption id="reference">123
8</table>