Update web-platform-tests to revision 20a217cb8488e4339e0c9610aba99e2654b676c3

This commit is contained in:
WPT Sync Bot 2020-04-17 08:19:21 +00:00
parent 3ca86eeba5
commit 21de781e2a
285 changed files with 5707 additions and 670 deletions

View file

@ -6,7 +6,18 @@
<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-inline-010-ref.html">
<link rel="match" href="reference/hyphens-auto-inline-010M-ref.html">
<link rel="match" href="reference/hyphens-auto-inline-010H-ref.html">
<!--
User agents may use U+2010 HYPHEN <https://codepoints.net/U+2010>
when the font has the glyph, or
may use U+002D HYPHEN-MINUS <https://codepoints.net/U+002d>
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="" name="flags">
<meta content="When 'hyphens' is set to 'auto' and applied to an inline element 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.">
@ -17,25 +28,25 @@
border: black solid 2px;
font-family: monospace;
font-size: 32px;
margin-bottom: 0.25em;
width: 6ch;
}
span#test
span
{
hyphens: auto;
}
div#reference
{
hyphens: none;
}
</style>
<body lang="en">
<p>Test passes if the characters inside of each black-bordered rectangles are laid out identically.
<div>There are <span>new guidelines now</span>.</div>
<div>There are <span id="test">new guidelines now</span>.</div>
<div id="reference">There are new guide-lines now.</div>
<!--
Expected result:
There
are
new
guide-
lines
now.
-->

View file

@ -6,7 +6,18 @@
<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">
<link rel="match" href="reference/hyphens-manual-011M-ref.html">
<link rel="match" href="reference/hyphens-manual-011H-ref.html">
<!--
User agents may use U+2010 HYPHEN <https://codepoints.net/U+2010>
when the font has the glyph, or
may use U+002D HYPHEN-MINUS <https://codepoints.net/U+002d>
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="" 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">
@ -17,26 +28,19 @@
border: black solid 2px;
font-family: monospace;
font-size: 32px;
margin-bottom: 0.25em;
width: 10ch;
}
div#test
{
hyphens: manual;
}
div#reference
{
hyphens: none;
width: 10ch;
}
</style>
<p>Test passes if the characters inside of each black-bordered rectangles are laid out identically.
<div>Deoxy&shy;ribo&shy;nucleic acid</div>
<div id="test">Deoxy&shy;ribo&shy;nucleic acid</div>
<div id="reference">Deoxyribo-nucleic acid</div>
<!--
Expected result:
Deoxyribo-
nucleic
acid
-->
<!--

View file

@ -6,7 +6,18 @@
<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">
<link rel="match" href="reference/hyphens-manual-011M-ref.html">
<link rel="match" href="reference/hyphens-manual-011H-ref.html">
<!--
User agents may use U+2010 HYPHEN <https://codepoints.net/U+2010>
when the font has the glyph, or
may use U+002D HYPHEN-MINUS <https://codepoints.net/U+002d>
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="" 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">
@ -17,26 +28,19 @@
border: black solid 2px;
font-family: monospace;
font-size: 32px;
margin-bottom: 0.25em;
width: 10ch;
}
div#test
{
hyphens: manual;
}
div#reference
{
hyphens: none;
width: 10ch;
}
</style>
<p>Test passes if the characters inside of each black-bordered rectangles are laid out identically.
<div>Deo&shy;xy&shy;ribo&shy;nu&shy;cleic acid</div>
<div id="test">Deo&shy;xy&shy;ribo&shy;nu&shy;cleic acid</div>
<div id="reference">Deoxyribo-nucleic acid</div>
<!--
Expected result:
Deoxyribo-
nucleic
acid
-->
<!--

View file

@ -6,7 +6,18 @@
<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">
<link rel="match" href="reference/hyphens-manual-013M-ref.html">
<link rel="match" href="reference/hyphens-manual-013H-ref.html">
<!--
User agents may use U+2010 HYPHEN <https://codepoints.net/U+2010>
when the font has the glyph, or
may use U+002D HYPHEN-MINUS <https://codepoints.net/U+002d>
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="" 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">
@ -17,26 +28,19 @@
border: black solid 2px;
font-family: monospace;
font-size: 32px;
margin-bottom: 0.25em;
width: 10ch;
}
div#test
{
hyphens: manual;
}
div#reference
{
hyphens: none;
width: 10ch;
}
</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>Deoxy&shy;ribonucleic acid</div>
<div id="test">Deoxy&shy;ribonucleic acid</div>
<div id="reference">Deoxy-ribonucleic acid</div>
<!--
Expected result:
Deoxy-
ribonucleic
acid
-->
<!--

View file

@ -6,7 +6,18 @@
<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-inline-011-ref.html">
<link rel="match" href="reference/hyphens-manual-inline-011M-ref.html">
<link rel="match" href="reference/hyphens-manual-inline-011H-ref.html">
<!--
User agents may use U+2010 HYPHEN <https://codepoints.net/U+2010>
when the font has the glyph, or
may use U+002D HYPHEN-MINUS <https://codepoints.net/U+002d>
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="" name="flags">
<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">
@ -17,23 +28,21 @@
border: black solid 2px;
font-family: monospace;
font-size: 32px;
margin-bottom: 0.25em;
width: 10ch;
}
span#test
span
{
hyphens: manual;
}
div#reference
{
hyphens: none;
}
</style>
<p>Test passes if the characters inside of each black-bordered rectangles are laid out identically.
<div>DNA <span>means Deoxy&shy;ribo&shy;nucleic acid</span>.</div>
<div>DNA <span id="test">means Deoxy&shy;ribo&shy;nucleic acid</span>.</div>
<div id="reference">DNA means Deoxyribo-nucleic acid.</div>
<!--
Expected result:
DNA means
Deoxyribo-
nucleic
acid.
-->

View file

@ -6,7 +6,18 @@
<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-inline-012-ref.html">
<link rel="match" href="reference/hyphens-manual-inline-012M-ref.html">
<link rel="match" href="reference/hyphens-manual-inline-012H-ref.html">
<!--
User agents may use U+2010 HYPHEN <https://codepoints.net/U+2010>
when the font has the glyph, or
may use U+002D HYPHEN-MINUS <https://codepoints.net/U+002d>
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="" name="flags">
<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 4 hyphenation opportunities. Since 'Deoxy' has 5 characters and 'Deoxyribo' has 9 characters and since the content width of the block box can take 8 characters, then a soft hyphen will occur after 'Deoxy'. Since 'ribonu' has 6 characters and 'ribonucleic' has 11 characters and since the content width of the block box can take 8 characters, then a soft hyphen will occur after 'ribonu'." name="assert">
@ -17,23 +28,23 @@
border: black solid 2px;
font-family: monospace;
font-size: 32px;
margin-bottom: 0.25em;
width: 8ch;
}
span#test
span
{
hyphens: manual;
}
div#reference
{
hyphens: none;
}
</style>
<p>Test passes if the characters inside of each black-bordered rectangles are laid out identically.
<div>DNA <span>means Deo&shy;xy&shy;ribo&shy;nu&shy;cleic acid</span>.</div>
<div>DNA <span id="test">means Deo&shy;xy&shy;ribo&shy;nu&shy;cleic acid</span>.</div>
<div id="reference">DNA means Deoxy-ribonu-cleic acid.</div>
<!--
Expected result:
DNA
means
Deoxy-
ribonu-
cleic
acid.
-->

View file

@ -12,16 +12,18 @@
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 the characters inside of each black-bordered rectangles are laid out identically.
<div>There<br>are<br>new<br>guide&#x2010;<br>lines<br>now.</div>
<div>There are new guide-lines now.</div>
<!--
<div>There are new guide-lines now.</div>
Hyphen-minus == &#x002D; == &#0045;
Hyphen == &#x2010; == &#8208;
-->

View file

@ -12,16 +12,18 @@
border: black solid 2px;
font-family: monospace;
font-size: 32px;
hyphens: none;
margin-bottom: 0.25em;
width: 8ch;
width: 6ch;
}
</style>
<body lang="en">
<p>Test passes if the characters inside of each black-bordered rectangles are laid out identically.
<div>There<br>are<br>new<br>guide&#x002D;<br>lines<br>now.</div>
<div>DNA means Deoxy-ribonu-cleic acid.</div>
<!--
<div>DNA means Deoxy-ribonu-cleic acid.</div>
Hyphen-minus == &#x002D; == &#0045;
Hyphen == &#x2010; == &#8208;
-->

View file

@ -12,16 +12,16 @@
border: black solid 2px;
font-family: monospace;
font-size: 32px;
hyphens: none;
margin-bottom: 0.25em;
width: 10ch;
}
</style>
<body>
<div>Deoxyribo&#x2010;<br>nucleic acid</div>
<p>Test passes if the characters inside of each black-bordered rectangles are laid out identically.
<!--
<div>Deoxyribo-nucleic acid</div>
Hyphen-minus == &#x002D; == &#0045;
<div>Deoxyribo-nucleic acid</div>
Hyphen == &#x2010; == &#8208;
-->

View file

@ -12,16 +12,16 @@
border: black solid 2px;
font-family: monospace;
font-size: 32px;
hyphens: none;
margin-bottom: 0.25em;
width: 10ch;
}
</style>
<body>
<div>Deoxyribo&#x002D;<br>nucleic acid</div>
<p>Test passes if the characters inside of each black-bordered rectangles are laid out identically.
<!--
<div>DNA means Deoxyribo-nucleic acid.</div>
Hyphen-minus == &#x002D; == &#0045;
<div>DNA means Deoxyribo-nucleic acid.</div>
Hyphen == &#x2010; == &#8208;
-->

View file

@ -1,27 +0,0 @@
<!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,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;
width: 10ch;
}
</style>
<div>Deoxy&#x2010;<br>ribonucleic acid</div>
<!--
Hyphen-minus == &#x002D; == &#0045;
Hyphen == &#x2010; == &#8208;
-->

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;
width: 10ch;
}
</style>
<div>Deoxy&#x002D;<br>ribonucleic acid</div>
<!--
Hyphen-minus == &#x002D; == &#0045;
Hyphen == &#x2010; == &#8208;
-->

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;
width: 10ch;
}
</style>
<div>DNA means<br>Deoxyribo&#x2010;<br>nucleic<br>acid.</div>
<!--
Hyphen-minus == &#x002D; == &#0045;
Hyphen == &#x2010; == &#8208;
-->

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;
width: 10ch;
}
</style>
<div>DNA means<br>Deoxyribo&#x002D;<br>nucleic<br>acid.</div>
<!--
Hyphen-minus == &#x002D; == &#0045;
Hyphen == &#x2010; == &#8208;
-->

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;
width: 8ch;
}
</style>
<div>DNA<br>means<br>Deoxy&#x2010;<br>ribonu&#x2010;<br>cleic<br>acid.</div>
<!--
Hyphen-minus == &#x002D; == &#0045;
Hyphen == &#x2010; == &#8208;
-->

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;
width: 8ch;
}
</style>
<div>DNA<br>means<br>Deoxy&#x002D;<br>ribonu&#x002D;<br>cleic<br>acid.</div>
<!--
Hyphen-minus == &#x002D; == &#0045;
Hyphen == &#x2010; == &#8208;
-->

View file

@ -0,0 +1,53 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<title>CSS Text: 'white-space: break-spaces' with 4 white spaces and 4 line feeda</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/ref-filled-green-100px-square.xht">
<link rel="stylesheet" type="text/css" href="/fonts/ahem.css">
<meta content="" name="flags">
<meta content="This test checks that when 'white-space' is set to 'break-spaces', then line feeds (&amp;NewLine; in the code) are preserved, just like with 'white-space: pre' or with 'white-space: pre-wrap'.">
<style>
div
{
font-family: Ahem;
font-size: 25px;
line-height: 1;
width: 4em;
}
div#overlapped-red-reference
{
background-color: red;
height: 4em;
}
div#overlapping-green-test
{
background-color: green;
bottom: 4em;
color: red;
position: relative;
white-space: break-spaces;
}
</style>
<p>Test passes if there is a filled green square and <strong>no red</strong>.
<div id="overlapped-red-reference"></div>
<div id="overlapping-green-test">&NewLine;&NewLine; &NewLine;&NewLine;</div>
<!-- ^ ^
4 consecutive white spaces: 1234
-->
<!--
&NewLine; == Line feed == &#x000A; == &#0010;
-->

View file

@ -0,0 +1,53 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<title>CSS Text: 'white-space: break-spaces', 10 white spaces and 1 line feed</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/ref-filled-green-100px-square.xht">
<link rel="stylesheet" type="text/css" href="/fonts/ahem.css">
<meta content="" name="flags">
<meta content="This test checks that when 'white-space' is set to 'break-spaces', then line feeds (&amp;NewLine; in the code) are preserved, just like with 'white-space: pre' or with 'white-space: pre-wrap'.">
<style>
div
{
font-family: Ahem;
font-size: 25px;
line-height: 1;
width: 4em;
}
div#overlapped-red-reference
{
background-color: red;
height: 4em;
}
div#overlapping-green-test
{
background-color: green;
bottom: 4em;
color: red;
position: relative;
white-space: break-spaces;
}
</style>
<p>Test passes if there is a filled green square and <strong>no red</strong>.
<div id="overlapped-red-reference"></div>
<div id="overlapping-green-test"> &NewLine; </div>
<!-- ^ ^ ^
10 white spaces: 1 234567890
-->
<!--
&NewLine; == Line feed == &#x000A; == &#0010;
-->

View file

@ -0,0 +1,53 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<title>CSS Text: 'white-space: break-spaces', 7 white spaces and 2 line feeds</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/ref-filled-green-100px-square.xht">
<link rel="stylesheet" type="text/css" href="/fonts/ahem.css">
<meta content="" name="flags">
<meta content="This test checks that when 'white-space' is set to 'break-spaces', then line feeds (&amp;NewLine; in the code) are preserved, just like with 'white-space: pre' or with 'white-space: pre-wrap'.">
<style>
div
{
font-family: Ahem;
font-size: 25px;
line-height: 1;
width: 4em;
}
div#overlapped-red-reference
{
background-color: red;
height: 4em;
}
div#overlapping-green-test
{
background-color: green;
bottom: 4em;
color: red;
position: relative;
white-space: break-spaces;
}
</style>
<p>Test passes if there is a filled green square and <strong>no red</strong>.
<div id="overlapped-red-reference"></div>
<div id="overlapping-green-test"> &NewLine; &NewLine; </div>
<!-- ^ ^ ^ ^
7 white spaces: 1 2 34567
-->
<!--
&NewLine; == Line feed == &#x000A; == &#0010;
-->

View file

@ -0,0 +1,53 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<title>CSS Text: 'white-space: break-spaces', 4 white spaces and 3 line feeds</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/ref-filled-green-100px-square.xht">
<link rel="stylesheet" type="text/css" href="/fonts/ahem.css">
<meta content="" name="flags">
<meta content="This test checks that when 'white-space' is set to 'break-spaces', then line feeds (&amp;NewLine; in the code) are preserved, just like with 'white-space: pre' or with 'white-space: pre-wrap'.">
<style>
div
{
font-family: Ahem;
font-size: 25px;
line-height: 1;
width: 4em;
}
div#overlapped-red-reference
{
background-color: red;
height: 4em;
}
div#overlapping-green-test
{
background-color: green;
bottom: 4em;
color: red;
position: relative;
white-space: break-spaces;
}
</style>
<p>Test passes if there is a filled green square and <strong>no red</strong>.
<div id="overlapped-red-reference"></div>
<div id="overlapping-green-test"> &NewLine; &NewLine; &NewLine; </div>
<!-- ^ ^ ^ ^
4 white spaces: 1 2 3 4
-->
<!--
&NewLine; == Line feed == &#x000A; == &#0010;
-->

View file

@ -0,0 +1,53 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<title>CSS Text: 'white-space: break-spaces', 3 white spaces and 3 line feeds</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/ref-filled-green-100px-square.xht">
<link rel="stylesheet" type="text/css" href="/fonts/ahem.css">
<meta content="" name="flags">
<meta content="This test checks that when 'white-space' is set to 'break-spaces', then line feeds (&amp;NewLine; in the code) are preserved, just like with 'white-space: pre' or with 'white-space: pre-wrap'.">
<style>
div
{
font-family: Ahem;
font-size: 25px;
line-height: 1;
width: 4em;
}
div#overlapped-red-reference
{
background-color: red;
height: 4em;
}
div#overlapping-green-test
{
background-color: green;
bottom: 4em;
color: red;
position: relative;
white-space: break-spaces;
}
</style>
<p>Test passes if there is a filled green square and <strong>no red</strong>.
<div id="overlapped-red-reference"></div>
<div id="overlapping-green-test">&NewLine; &NewLine; &NewLine; </div>
<!-- ^ ^ ^
3 white spaces: 1 2 3
-->
<!--
&NewLine; == Line feed == &#x000A; == &#0010;
-->

View file

@ -0,0 +1,50 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<title>CSS Text: 'white-space: break-spaces' and 4 consecutive line feeds</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/ref-filled-green-100px-square.xht">
<link rel="stylesheet" type="text/css" href="/fonts/ahem.css">
<meta content="" name="flags">
<meta content="This test checks that when 'white-space' is set to 'break-spaces', then line feeds (&amp;NewLine; in the code) are preserved, just like with 'white-space: pre' or with 'white-space: pre-wrap'.">
<style>
div
{
font-family: Ahem;
font-size: 25px;
line-height: 1;
width: 4em;
}
div#overlapped-red-reference
{
background-color: red;
height: 4em;
}
div#overlapping-green-test
{
background-color: green;
bottom: 4em;
color: red;
position: relative;
white-space: break-spaces;
}
</style>
<p>Test passes if there is a filled green square and <strong>no red</strong>.
<div id="overlapped-red-reference"></div>
<div id="overlapping-green-test">&NewLine;&NewLine;&NewLine;&NewLine;</div>
<!--
&NewLine; == Line feed == &#x000A; == &#0010;
-->