mirror of
https://github.com/servo/servo.git
synced 2025-08-12 17:05:33 +01:00
Update web-platform-tests to revision eb12303bec1d47bbe91ebf011d17d81ec6fce68d
This commit is contained in:
parent
6ca767d7f9
commit
916ba6ef4d
467 changed files with 6716 additions and 1478 deletions
|
@ -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>
|
|
@ -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
|
||||
|
||||
-->
|
|
@ -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­ribo­nucleic acid</div>
|
||||
|
||||
<div id="reference">Deoxyribo-nucleic acid</div>
|
||||
|
||||
<!--
|
||||
|
||||
Extended form of abreviation DNA
|
||||
|
||||
-->
|
|
@ -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­xy­ribo­nu­cleic acid</div>
|
||||
|
||||
<div id="reference">Deoxyribo-nucleic acid</div>
|
||||
|
||||
<!--
|
||||
|
||||
Extended form of abreviation DNA
|
||||
|
||||
-->
|
|
@ -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­ribonucleic acid</div>
|
||||
|
||||
<div id="reference">Deoxy-ribonucleic acid</div>
|
||||
|
||||
<!--
|
||||
|
||||
Extended form of abreviation DNA
|
||||
|
||||
-->
|
|
@ -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­ribo­nucleic acid</div>
|
||||
|
||||
<div id="reference">Deoxyribonucleic acid</div>
|
||||
|
||||
<!--
|
||||
|
||||
Extended form of abreviation DNA
|
||||
|
||||
-->
|
|
@ -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>
|
|
@ -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>
|
|
@ -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>
|
|
@ -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>
|
|
@ -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
</span><span> CD</span></div>
|
||||
|
||||
<!--
|
||||
|
||||

 == Line feed == 
 == 

|
||||
|
||||
-->
|
|
@ -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
</span><span> CD</span></div>
|
||||
|
||||
<!--
|
||||
|
||||

 == Line feed == 
 == 

|
||||
|
||||
-->
|
|
@ -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
</span><span> CD</span></div>
|
||||
|
||||
<!--
|
||||
|
||||

 == Line feed == 
 == 

|
||||
|
||||
-->
|
|
@ -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
</span><span> CD</span></div>
|
||||
|
||||
<!--
|
||||
|
||||

 == Line feed == 
 == 

|
||||
|
||||
-->
|
|
@ -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
</span><span> CD</span></div>
|
||||
|
||||
<!--
|
||||
|
||||

 == Line feed == 
 == 

|
||||
|
||||
-->
|
|
@ -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
</span><span> CD</span></div>
|
||||
|
||||
<!--
|
||||
|
||||

 == Line feed == 
 == 

|
||||
|
||||
-->
|
|
@ -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>
|
|
@ -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 ipsum. Dolor sit amet.<br>
|
||||
consectetur</div>
|
||||
|
||||
<div id="reference">Lorem ipsum. Dolor sit amet.<br>
|
||||
consectetur</div>
|
|
@ -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 ipsum. Dolor<br>
|
||||
sit amet. <br>
|
||||
consectetur</div>
|
||||
|
||||
<div id="reference">Lorem ipsum. Dolor<br>
|
||||
sit amet. <br>
|
||||
consectetur</div>
|
|
@ -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>
|
||||
sit amet.</div>
|
||||
|
||||
<div>Lorem ipsum. <br>
|
||||
Dolor<br>
|
||||
sit amet.</div>
|
|
@ -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>
|
||||
sit amet.</div>
|
||||
|
||||
<div>Lorem ipsum. <br>
|
||||
Dolor<br>
|
||||
sit amet.</div>
|
|
@ -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>
|
|
@ -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>
|
|
@ -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>
|
|
@ -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>
|
|
@ -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	amet. <br>consectetur</div>
|
||||
|
||||
<div id="reference">Lorem ipsum.
|
||||
Dolor sit amet.
|
||||
consectetur</div>
|
||||
|
||||
<!--
|
||||
|
||||
<div id="test">Lorem ipsum. Dolor
|
||||
^^^^^^^^
|
||||
12345678
|
||||
|
||||
sit	amet. <br>consectetur</div>
|
||||
^^^
|
||||
123
|
||||
|
||||
|
||||
|
||||
	 == Horizontal tabulation == 	 == 	
|
||||
|
||||

 == Line feed == 
 == 

|
||||
|
||||
-->
|
|
@ -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	amet. <br>consectetur</div>
|
||||
|
||||
<div id="reference">Lorem ipsum. Dolor sit amet.<br>
|
||||
consectetur</div>
|
||||
|
||||
<!--
|
||||
|
||||
|
||||
<div id="test">Lorem ipsum. Dolor
|
||||
^^^^^^^^
|
||||
12345678
|
||||
|
||||
sit	amet. <br>consectetur</div>
|
||||
^^^
|
||||
123
|
||||
|
||||
	 == Horizontal tabulation == 	 == 	
|
||||
|
||||

 == Line feed == 
 == 

|
||||
|
||||
-->
|
|
@ -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	amet. <br>consectetur</div>
|
||||
|
||||
<div id="reference">Lorem ipsum. Dolor<br>
|
||||
sit amet. <br>
|
||||
consectetur</div>
|
||||
|
||||
<!--
|
||||
|
||||
<div id="test">Lorem ipsum. Dolor
|
||||
^^^^^^^^
|
||||
12345678
|
||||
|
||||
sit	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.
|
||||
|
||||
|
||||
	 == Horizontal tabulation == 	 == 	
|
||||
|
||||

 == Line feed == 
 == 

|
||||
|
||||
-->
|
|
@ -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	amet.</div>
|
||||
|
||||
<div id="reference">Lorem ipsum. <br>
|
||||
Dolor<br>
|
||||
sit amet.</div>
|
||||
|
||||
<!--
|
||||
|
||||
<div id="test">Lorem ipsum. Dolor
|
||||
^
|
||||
1
|
||||
|
||||
sit	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.
|
||||
|
||||
|
||||
	 == Horizontal tabulation == 	 == 	
|
||||
|
||||
-->
|
|
@ -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	amet.</div>
|
||||
|
||||
<div id="reference">Lorem ipsum. <br>
|
||||
Dolor<br>
|
||||
sit amet.</div>
|
||||
|
||||
<!--
|
||||
|
||||
<div id="test">Lorem ipsum. Dolor
|
||||
^
|
||||
1
|
||||
|
||||
sit	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.
|
||||
|
||||
|
||||
	 == Horizontal tabulation == 	 == 	
|
||||
|
||||
-->
|
|
@ -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	amet.</div>
|
||||
|
||||
<div id="reference">Lorem ipsum. <br>
|
||||
Dolor<br>
|
||||
sit amet.</div>
|
||||
|
||||
<!--
|
||||
|
||||
<div id="test">Lorem ipsum. Dolor
|
||||
^^^^^^
|
||||
123456
|
||||
|
||||
sit	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.
|
||||
|
||||
|
||||
	 == Horizontal tabulation == 	 == 	
|
||||
|
||||
-->
|
|
@ -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	amet.</div>
|
||||
|
||||
<div id="reference">Lorem ipsum. <br>
|
||||
Dolor<br>
|
||||
sit amet.</div>
|
||||
|
||||
<!--
|
||||
|
||||
<div id="test">Lorem ipsum. Dolor
|
||||
^^^^^^
|
||||
123456
|
||||
|
||||
sit	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.
|
||||
|
||||
|
||||
	 == Horizontal tabulation == 	 == 	
|
||||
|
||||
-->
|
|
@ -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
</span><span> CD</span></div>
|
||||
|
||||
<!--
|
||||
|
||||

 == Line feed == 
 == 

|
||||
|
||||
-->
|
|
@ -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
</span><span> CD</span></div>
|
||||
|
||||
<!--
|
||||
|
||||

 == Line feed == 
 == 

|
||||
|
||||
-->
|
|
@ -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>
|
||||
|
|
@ -18,7 +18,7 @@ div {
|
|||
|
||||
width: 2ch;
|
||||
white-space: pre-wrap;
|
||||
overflow-wrap: break-word;
|
||||
word-break: break-all;
|
||||
}
|
||||
</style>
|
||||
|
||||
|
|
|
@ -25,7 +25,7 @@ div {
|
|||
|
||||
width: 5ch;
|
||||
white-space: pre-wrap;
|
||||
overflow-wrap: break-word;
|
||||
word-break: break-all;
|
||||
}
|
||||
</style>
|
||||
|
||||
|
|
|
@ -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>
|
|
@ -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>
|
|
@ -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>
|
|
@ -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>
|
|
@ -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>
|
|
@ -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>
|
|
@ -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>
|
|
@ -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>
|
|
@ -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>
|
|
@ -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>
|
|
@ -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>
|
|
@ -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>
|
|
@ -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>
|
|
@ -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>
|
Loading…
Add table
Add a link
Reference in a new issue