mirror of
https://github.com/servo/servo.git
synced 2025-08-13 17:35:36 +01:00
Update web-platform-tests to revision 4dbc8a0d7b1b1c032aaddc2579ec7239ad565127
This commit is contained in:
WPT Sync Bot
Josh Matthews
parent
40f1e188d0
commit
d1e28c482e
329 changed files with 5366 additions and 1699 deletions
|
|
@ -0,0 +1,30 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Text Test: overflow-wrap: anywhere</title>
|
||||
<link rel="author" title="Florian Rivoal" href="http://florian.rivoal.net/">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-text-3/#valdef-overflow-wrap-anywhere">
|
||||
<meta name="flags" content="ahem">
|
||||
<link rel="match" href="reference/overflow-wrap-break-word-001-ref.html">
|
||||
<meta name="assert" content="sequences of nbsp characters that would cause overflow are expected to be broken when overflow-wrap is anywhere">
|
||||
<style>
|
||||
div {
|
||||
position: relative;
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
font-family: Ahem;
|
||||
color: red;
|
||||
overflow-wrap: anywhere;
|
||||
font-size: 25px;
|
||||
line-height: 27px;
|
||||
}
|
||||
div::after{
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 0; left: 0; bottom: 0; right: 0;
|
||||
background: green;
|
||||
}
|
||||
</style>
|
||||
<body>
|
||||
<p>Test passes if there is a <strong>filled green square</strong> and <strong>no red</strong>.</p>
|
||||
<div> X</div>
|
||||
</body>
|
||||
|
|
@ -0,0 +1,31 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Text Test: overflow-wrap: anywhere + white-space:break-spaces</title>
|
||||
<link rel="author" title="Florian Rivoal" href="https://florian.rivoal.net/">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-text-3/#valdef-overflow-wrap-anywhere">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-text-3/#valdef-white-space-break-spaces">
|
||||
<meta name="flags" content="ahem">
|
||||
<link rel="match" href="reference/overflow-wrap-break-word-002-ref.html">
|
||||
<meta name="assert" content="anywhere + break-spaces do not allow a break
|
||||
between the last character of a word and the first space of a sequence of preserved spaces
|
||||
if there are other wrapping opportunities earlier in the line">
|
||||
<style>
|
||||
div {
|
||||
white-space: break-spaces;
|
||||
overflow-wrap: anywhere;
|
||||
font-family: monospace;
|
||||
width: 5ch;
|
||||
line-height: 1;
|
||||
overflow: hidden;
|
||||
height: 1em;
|
||||
}
|
||||
</style>
|
||||
|
||||
<p>This test passes if there is nothing below this sentence.
|
||||
<div> FAIL <div>
|
||||
<!--
|
||||
white-space:break-spaces should cause the spaces at the end of the line to be preserved.
|
||||
Since there is an allowed break point between the first space and the F,
|
||||
that's where the line should wrap,
|
||||
not between the L and the subsequent space.
|
||||
-->
|
||||
|
|
@ -0,0 +1,25 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Text Test: overflow-wrap:anywhere + white-space:break-spaces</title>
|
||||
<link rel="author" title="Florian Rivoal" href="https://florian.rivoal.net/">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-text-3/#valdef-overflow-wrap-anywhere">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-text-3/#valdef-white-space-break-spaces">
|
||||
<meta name="flags" content="ahem">
|
||||
<link rel="match" href="reference/overflow-wrap-break-word-003-ref.html">
|
||||
<meta name="assert" content="anywhere + break-spaces do allow a break
|
||||
between the last character of a word and the first space of a sequence of preserved spaces
|
||||
if there are no other wrapping opportunities earlier in the line">
|
||||
<style>
|
||||
div {
|
||||
white-space: break-spaces;
|
||||
overflow-wrap: anywhere;
|
||||
font-family: monospace;
|
||||
width: 4ch;
|
||||
line-height: 1;
|
||||
overflow: hidden;
|
||||
height: 2em;
|
||||
}
|
||||
</style>
|
||||
|
||||
<p>This test passes if the word FAIL does not appear below.
|
||||
<div>PASS FAIL<div>
|
||||
|
|
@ -0,0 +1,36 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Text Test: overflow-wrap: anywhere</title>
|
||||
<link rel="author" title="Javier Fernandez Garcia-Boente" href="mailto:jfernandez@igalia.com">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-text-3/#valdef-overflow-wrap-anywhere">
|
||||
<meta name="flags" content="ahem">
|
||||
<link rel="match" href="reference/overflow-wrap-break-word-001-ref.html">
|
||||
<meta name="assert" content="A Single leading white-space constitutes a soft breaking opportunity, honoring the 'white-space: pre-wrap' property, that must prevent the word to be broken.">
|
||||
<style>
|
||||
div {
|
||||
position: relative;
|
||||
font-size: 20px;
|
||||
font-family: Ahem;
|
||||
line-height: 1em;
|
||||
}
|
||||
.red {
|
||||
position: absolute;
|
||||
background: green;
|
||||
color: red;
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
z-index: -1;
|
||||
}
|
||||
.test {
|
||||
color: green;
|
||||
width: 5ch;
|
||||
|
||||
white-space: pre-wrap;
|
||||
overflow-wrap: anywhere;
|
||||
}
|
||||
</style>
|
||||
<body>
|
||||
<p>Test passes if there is a <strong>filled green square</strong> and <strong>no red</strong>.</p>
|
||||
<div class="red"><br>XXXXX</div>
|
||||
<div class="test"> XXXXX </div>
|
||||
</body>
|
||||
|
|
@ -0,0 +1,36 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Text Test: overflow-wrap: anywhere</title>
|
||||
<link rel="author" title="Javier Fernandez Garcia-Boente" href="mailto:jfernandez@igalia.com">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-text-3/#valdef-overflow-wrap-anywhere">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-text-3/#valdef-white-space-pre-wrap">
|
||||
<meta name="flags" content="ahem">
|
||||
<link rel="match" href="reference/overflow-wrap-break-word-001-ref.html">
|
||||
<meta name="assert" content="A Single leading white-space constitutes a soft breaking opportunity, honoring the 'white-space: pre-wrap' property, that must prevent the word to be broken.">
|
||||
<style>
|
||||
div {
|
||||
position: relative;
|
||||
font-size: 20px;
|
||||
font-family: Ahem;
|
||||
line-height: 1em;
|
||||
}
|
||||
.fail {
|
||||
position: absolute;
|
||||
color: red;
|
||||
z-index: -1;
|
||||
}
|
||||
span { color: green; }
|
||||
.test {
|
||||
color: green;
|
||||
width: 5ch;
|
||||
|
||||
white-space: pre-wrap;
|
||||
overflow-wrap: anywhere;
|
||||
}
|
||||
</style>
|
||||
<body>
|
||||
<p>Test passes if there is a <strong>filled green square</strong> and <strong>no red</strong>.</p>
|
||||
<div class="fail">XXX<span>XX<br></span><span>XXXXX<br></span>XXXXX<br>XXXX<span>X<br></span><span>XXXXX</span></div>
|
||||
<div class="test">XXX
|
||||
XXXXXXXXX</div>
|
||||
</body>
|
||||
|
|
@ -0,0 +1,23 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Text Test: overflow-wrap: anywhere with fit-content</title>
|
||||
<link rel="author" title="Koji Ishii" href="mailto:kojiishi@gmail.com">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-text-3/#overflow-wrap-property">
|
||||
<meta name="flags" content="">
|
||||
<link rel="match" href="reference/overflow-wrap-break-word-fit-content-001.html">
|
||||
<meta name="assert" content="The 'overflow-wrap: anywhere' must not break non-BMP characters (which might be represented as surrogate pairs internally)">
|
||||
<style>
|
||||
.test {
|
||||
display: inline-block;
|
||||
overflow-wrap: anywhere;
|
||||
font-size: 20px;
|
||||
line-height: 1;
|
||||
margin-bottom: .2em;
|
||||
}
|
||||
</style>
|
||||
<body>
|
||||
<div id="log"></div>
|
||||
<p class="instructions">Tests pass if all lines do not wrap.
|
||||
<div><div class="test">𝜋</div></div>
|
||||
<div><div class="test">𝜋</div></div>
|
||||
</body>
|
||||
|
|
@ -0,0 +1,17 @@
|
|||
<!DOCTYPE html>
|
||||
<title>CSS Text Test: overflow-wrap: anywhere</title>
|
||||
<link rel="author" title="Koji Ishii" href="kojii@chromium.org">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-text-3/#valdef-overflow-wrap-anywhere">
|
||||
<link rel="match" href="reference/overflow-wrap-break-word-span-001-ref.html">
|
||||
<meta name="assert" content="Test when the `anywhere` value is applied to an inline element.">
|
||||
<style>
|
||||
div {
|
||||
font-size: 10px;
|
||||
line-height: 1;
|
||||
width: 8ch;
|
||||
}
|
||||
span {
|
||||
word-wrap: anywhere;
|
||||
}
|
||||
</style>
|
||||
<div>12345<span>67890</span></div>
|
||||
|
|
@ -0,0 +1,22 @@
|
|||
<!DOCTYPE html>
|
||||
<title>CSS Text Test: overflow-wrap: anywhere</title>
|
||||
<link rel="author" title="Koji Ishii" href="kojii@chromium.org">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-text-3/#valdef-overflow-wrap-anywhere">
|
||||
<meta name="assert" content="Test when the `anywhere` value is applied to an inline element.">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/resources/check-layout-th.js"></script><style>
|
||||
div {
|
||||
font-size: 10px;
|
||||
line-height: 1;
|
||||
width: 5ch;
|
||||
}
|
||||
span {
|
||||
word-wrap: anywhere;
|
||||
}
|
||||
</style>
|
||||
<div id=container data-expected-height=20>12345678<span>90</span></div>
|
||||
|
||||
<script>
|
||||
checkLayout('#container')
|
||||
</script>
|
||||
|
|
@ -0,0 +1,41 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Text Test: overflow-wrap: anywhere and intrinsic sizing</title>
|
||||
<link rel="author" title="Florian Rivoal" href="http://florian.rivoal.net/">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-text-3/#overflow-wrap-property">
|
||||
<meta name="flags" content="">
|
||||
<link rel="match" href="reference/overflow-wrap-min-content-size-004-ref.html">
|
||||
<meta name="assert" content="Soft wrap opportunities introduced by overflow-wrap:break-word **are not** considered when calculating min-content intrinsic sizes.">
|
||||
<style>
|
||||
table {
|
||||
overflow-wrap: break-word;
|
||||
max-width: 0;
|
||||
border: 0;
|
||||
border-collapse: collapse;
|
||||
}
|
||||
td {
|
||||
padding: 0;
|
||||
background: green;
|
||||
color: transparent;
|
||||
}
|
||||
#red {
|
||||
position: absolute;
|
||||
z-index: -1;
|
||||
background: red;
|
||||
color: transparent;
|
||||
}
|
||||
</style>
|
||||
|
||||
<p>Test passes if there is a green box below and no red.
|
||||
<div id=red>XXXX</div>
|
||||
<table><tr><td>XXXX</table>
|
||||
|
||||
<!--
|
||||
width:min-content on the div directly without using a table
|
||||
would achieve the goal of this test, and be a lot simpler.
|
||||
|
||||
However, width:min-content is not yet widely supported.
|
||||
|
||||
Using a table, and forcing it to be as small as possible
|
||||
will achieve min-content sizing of the div in all browsers.
|
||||
-->
|
||||
|
|
@ -0,0 +1,14 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Text Test reference</title>
|
||||
<link rel="author" title="Florian Rivoal" href="http://florian.rivoal.net/">
|
||||
<style>
|
||||
div {
|
||||
position: absolute;
|
||||
background: green;
|
||||
color: transparent;
|
||||
}
|
||||
</style>
|
||||
|
||||
<p>Test passes if there is a green box below and no red.
|
||||
<div>XXXX</div>
|
||||
|
|
@ -0,0 +1,15 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Text level 3 Test reference</title>
|
||||
<link rel="author" title="Florian Rivoal" href="https://florian.rivoal.net/">
|
||||
<style>
|
||||
div {
|
||||
margin-left: 50px;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
background: green;
|
||||
}
|
||||
</style>
|
||||
|
||||
<p>Test passes if there is a green square and no red.
|
||||
<div></div>
|
||||
|
|
@ -0,0 +1,40 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Text level 3 Test: tab-size in lengths inherit as absolute lengths</title>
|
||||
<link rel="author" title="Florian Rivoal" href="https://florian.rivoal.net/">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-text-3/#tab-size-property">
|
||||
<link rel="match" href="tab-size-inheritance-001-ref.html">
|
||||
<meta name="assert" content="tab-size in lengths inherit as absolute lengths">
|
||||
<style>
|
||||
.test {
|
||||
font-family: monospace;
|
||||
font-size: 10px;
|
||||
tab-size: 5em;
|
||||
}
|
||||
.test div {
|
||||
white-space: pre;
|
||||
font-size: 20px
|
||||
}
|
||||
.test span {
|
||||
display: inline-block;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
background: green;
|
||||
}
|
||||
.ref {
|
||||
z-index: -1;
|
||||
margin-left: 50px;
|
||||
position: absolute;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
background: red;
|
||||
|
||||
/* this is to avoid antialiasing effects at the edge */
|
||||
box-sizing: border-box;
|
||||
border: 2px solid white;
|
||||
}
|
||||
</style>
|
||||
|
||||
<p>Test passes if there is a green square and no red.
|
||||
<div class=ref></div>
|
||||
<div class=test><div>	<span></span></div></div>
|
||||
|
|
@ -7,8 +7,14 @@
|
|||
body { background: white; }
|
||||
div {
|
||||
padding-left: 50px;
|
||||
font-family: Ahem;
|
||||
}
|
||||
span {
|
||||
display: inline-block;
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
background: green;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div>X</div>
|
||||
<p>Test passes if there is a green square below and no red.
|
||||
<div><span></span></div>
|
||||
|
|
|
|||
|
|
@ -9,17 +9,32 @@
|
|||
<meta name="assert" content="Percentages in text-indent refer to width of the element's content box">
|
||||
<style>
|
||||
body { background: white; }
|
||||
section { position: absolute; }
|
||||
section, div {
|
||||
border-right: 10px solid white;
|
||||
margin-right: 10px;
|
||||
padding-right: 10px;
|
||||
font-family: Ahem;
|
||||
}
|
||||
div {
|
||||
box-sizing: border-box;
|
||||
width: 120px;
|
||||
}
|
||||
span {
|
||||
display: inline-block;
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
background: green;
|
||||
}
|
||||
.ref span {
|
||||
background: red;
|
||||
/* the next two lines are to avoid antialiasing artifacts causing a tiny about of red to be visible */
|
||||
box-sizing: border-box;
|
||||
border: 1px solid white;
|
||||
}
|
||||
.test div { text-indent: 50%; }
|
||||
.ref div { text-indent: 50px; }
|
||||
</style>
|
||||
|
||||
<section class=test><div>X</div></section>
|
||||
<p>Test passes if there is a green square below and no red.
|
||||
<section class=ref><div><span></span></div></section>
|
||||
<section class=test><div><span></span></div></section>
|
||||
|
|
|
|||
|
|
@ -9,17 +9,32 @@
|
|||
<meta name="assert" content="Percentages in text-indent refer to width of the element's content box">
|
||||
<style>
|
||||
body { background: white; }
|
||||
section { position: absolute; }
|
||||
section, div {
|
||||
border-right: 10px solid white;
|
||||
margin-right: 10px;
|
||||
padding-right: 10px;
|
||||
font-family: Ahem;
|
||||
}
|
||||
div {
|
||||
box-sizing: border-box;
|
||||
width: 120px;
|
||||
}
|
||||
span {
|
||||
display: inline-block;
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
background: green;
|
||||
}
|
||||
.ref span {
|
||||
background: red;
|
||||
/* the next two lines are to avoid antialiasing artifacts causing a tiny about of red to be visible */
|
||||
box-sizing: border-box;
|
||||
border: 1px solid white;
|
||||
}
|
||||
.test div { text-indent: 50%; overflow: hidden; } /* overflow:hidden should not make any difference, but it does in some browsers */
|
||||
.ref div { text-indent: 50px; }
|
||||
</style>
|
||||
|
||||
<section class=test><div>X</div></section>
|
||||
<p>Test passes if there is a green square below and no red.
|
||||
<section class=ref><div><span></span></div></section>
|
||||
<section class=test><div><span></span></div></section>
|
||||
|
|
|
|||
|
|
@ -9,6 +9,7 @@
|
|||
<meta name="assert" content="Percentages in text-indent refer to width of the element's content box, when used in a calc expression">
|
||||
<style>
|
||||
body { background: white; }
|
||||
section { position: absolute; }
|
||||
section, div {
|
||||
border-right: 10px solid white;
|
||||
margin-right: 10px;
|
||||
|
|
@ -19,7 +20,22 @@ div {
|
|||
box-sizing: border-box;
|
||||
width: 120px;
|
||||
}
|
||||
span {
|
||||
display: inline-block;
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
background: green;
|
||||
}
|
||||
.ref span {
|
||||
background: red;
|
||||
/* the next two lines are to avoid antialiasing artifacts causing a tiny about of red to be visible */
|
||||
box-sizing: border-box;
|
||||
border: 1px solid white;
|
||||
}
|
||||
.test div { text-indent: calc(25px + 25%); }
|
||||
.ref div { text-indent: 50px; }
|
||||
</style>
|
||||
|
||||
<section class=test><div>X</div></section>
|
||||
<p>Test passes if there is a green square below and no red.
|
||||
<section class=ref><div><span></span></div></section>
|
||||
<section class=test><div><span></span></div></section>
|
||||
|
|
|
|||
|
|
@ -1,69 +1,25 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8"/>
|
||||
<title>CSS3 Text, text transform: full-size-kana, small kanas</title>
|
||||
<meta name="assert" content="For small kanas, text-transform: full-size-kana puts all kanas in full-size kanas.">
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Text level 3 Test reference</title>
|
||||
<link rel="author" title="Florian Rivoal" href="https://florian.rivoal.net/">
|
||||
<link rel='author' title='Diego Pino Garcia' href='mailto:dpino@igalia.com'>
|
||||
<link rel='help' href='https://drafts.csswg.org/css-text-3/#text-transform'>
|
||||
<style type='text/css'>
|
||||
.test, .ref { font-size: 200%; line-height: 2.5em; }
|
||||
.test span, .ref span { margin-right: 1em; white-space: nowrap; }
|
||||
/* the CSS above is not part of the test */
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<p class="instructions">Test passes if both characters in each pair match. If you are missing a font glyph for a character, ignore that pair, but report which characters were ignored.</p>
|
||||
<div class="test">
|
||||
<span title="U+3041">あ あ</span>
|
||||
<span title="U+3043">い い</span>
|
||||
<span title="U+3045">う う</span>
|
||||
<span title="U+3047">え え</span>
|
||||
<span title="U+3049">お お</span>
|
||||
<span title="U+3095">か か</span>
|
||||
<span title="U+3096">け け</span>
|
||||
<span title="U+3063">つ つ</span>
|
||||
<span title="U+3083">や や</span>
|
||||
<span title="U+3085">ゆ ゆ</span>
|
||||
<span title="U+3087">よ よ</span>
|
||||
<span title="U+308E">わ わ</span>
|
||||
<span title="U+30A1">ア ア</span>
|
||||
<span title="U+30A3">イ イ</span>
|
||||
<span title="U+30A5">ウ ウ</span>
|
||||
<span title="U+30A7">エ エ</span>
|
||||
<span title="U+30A9">オ オ</span>
|
||||
<span title="U+30F5">カ カ</span>
|
||||
<span title="U+31F0">ク ク</span>
|
||||
<span title="U+30F6">ケ ケ</span>
|
||||
<span title="U+31F1">シ シ</span>
|
||||
<span title="U+31F2">ス ス</span>
|
||||
<span title="U+30C3">ツ ツ</span>
|
||||
<span title="U+31F3">ト ト</span>
|
||||
<span title="U+31F4">ヌ ヌ</span>
|
||||
<span title="U+31F5">ハ ハ</span>
|
||||
<span title="U+31F6">ヒ ヒ</span>
|
||||
<span title="U+31F7">フ フ</span>
|
||||
<span title="U+31F8">ヘ ヘ</span>
|
||||
<span title="U+31F9">ホ ホ</span>
|
||||
<span title="U+31FA">ム ム</span>
|
||||
<span title="U+30E3">ヤ ヤ</span>
|
||||
<span title="U+30E5">ユ ユ</span>
|
||||
<span title="U+30E7">ヨ ヨ</span>
|
||||
<span title="U+31FB">ラ ラ</span>
|
||||
<span title="U+31FC">リ リ</span>
|
||||
<span title="U+31FD">ル ル</span>
|
||||
<span title="U+31FE">レ レ</span>
|
||||
<span title="U+31FF">ロ ロ</span>
|
||||
<span title="U+30EE">ワ ワ</span>
|
||||
<span title="U+FF67">ｱ ｱ</span>
|
||||
<span title="U+FF68">ｲ ｲ</span>
|
||||
<span title="U+FF69">ｳ ｳ</span>
|
||||
<span title="U+FF6A">ｴ ｴ</span>
|
||||
<span title="U+FF6B">ｵ ｵ</span>
|
||||
<span title="U+FF6F">ﾂ ﾂ</span>
|
||||
<span title="U+FF6C">ﾔ ﾔ</span>
|
||||
<span title="U+FF6D">ﾕ ﾕ</span>
|
||||
<span title="U+FF6E">ﾖ ﾖ</span>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
<p>Test passes if the characters in the second column are
|
||||
the same shape and size as those in the rightmost column,
|
||||
not small as those in the leftmost column.<br>
|
||||
Any missing glyph should be ignored as long as it is missing in both the second and the rightmost column.
|
||||
|
||||
<table>
|
||||
<tr><td>ぁ<td>あ<td>あ
|
||||
<tr><td>ぃ<td>い<td>い
|
||||
<tr><td>ぅ<td>う<td>う
|
||||
<tr><td>ぇ<td>え<td>え
|
||||
<tr><td>ぉ<td>お<td>お
|
||||
<tr><td>ゕ<td>か<td>か
|
||||
<tr><td>ゖ<td>け<td>け
|
||||
<tr><td>っ<td>つ<td>つ
|
||||
<tr><td>ゃ<td>や<td>や
|
||||
<tr><td>ゅ<td>ゆ<td>ゆ
|
||||
<tr><td>ょ<td>よ<td>よ
|
||||
<tr><td>ゎ<td>わ<td>わ
|
||||
</table>
|
||||
|
|
|
|||
|
|
@ -1,225 +1,26 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8"/>
|
||||
<title>CSS3 Text, text transform: full-size-kana, full-size kanas</title>
|
||||
<meta name="assert" content="For full-size kanas, text-transform: full-size-kana leaves all kanas unaltered.">
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Text level 3 Test Reference</title>
|
||||
<link rel="author" title="Florian Rivoal" href="https://florian.rivoal.net/">
|
||||
<link rel='author' title='Diego Pino Garcia' href='mailto:dpino@igalia.com'>
|
||||
<link rel='help' href='https://drafts.csswg.org/css-text-3/#text-transform'>
|
||||
<style type='text/css'>
|
||||
.test, .ref { font-size: 200%; line-height: 2.5em; }
|
||||
.test span, .ref span { margin-right: 1em; white-space: nowrap; }
|
||||
/* the CSS above is not part of the test */
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<p class="instructions">Test passes if both characters in each pair match. If you are missing a font glyph for a character, ignore that pair, but report which characters were ignored.</p>
|
||||
<div class="test">
|
||||
<span title="U+30FC">ー ー</span>
|
||||
<span title="U+3042">あ あ</span>
|
||||
<span title="U+3044">い い</span>
|
||||
<span title="U+3046">う う</span>
|
||||
<span title="U+3048">え え</span>
|
||||
<span title="U+304A">お お</span>
|
||||
<span title="U+304B">か か</span>
|
||||
<span title="U+304C">が が</span>
|
||||
<span title="U+304D">き き</span>
|
||||
<span title="U+304E">ぎ ぎ</span>
|
||||
<span title="U+304F">く く</span>
|
||||
<span title="U+3050">ぐ ぐ</span>
|
||||
<span title="U+3051">け け</span>
|
||||
<span title="U+3052">げ げ</span>
|
||||
<span title="U+3053">こ こ</span>
|
||||
<span title="U+3054">ご ご</span>
|
||||
<span title="U+3055">さ さ</span>
|
||||
<span title="U+3056">ざ ざ</span>
|
||||
<span title="U+3057">し し</span>
|
||||
<span title="U+3058">じ じ</span>
|
||||
<span title="U+3059">す す</span>
|
||||
<span title="U+305A">ず ず</span>
|
||||
<span title="U+305B">せ せ</span>
|
||||
<span title="U+305C">ぜ ぜ</span>
|
||||
<span title="U+305D">そ そ</span>
|
||||
<span title="U+305E">ぞ ぞ</span>
|
||||
<span title="U+305F">た た</span>
|
||||
<span title="U+3060">だ だ</span>
|
||||
<span title="U+3061">ち ち</span>
|
||||
<span title="U+3062">ぢ ぢ</span>
|
||||
<span title="U+3064">つ つ</span>
|
||||
<span title="U+3065">づ づ</span>
|
||||
<span title="U+3066">て て</span>
|
||||
<span title="U+3067">で で</span>
|
||||
<span title="U+3068">と と</span>
|
||||
<span title="U+3069">ど ど</span>
|
||||
<span title="U+306A">な な</span>
|
||||
<span title="U+306B">に に</span>
|
||||
<span title="U+306C">ぬ ぬ</span>
|
||||
<span title="U+306D">ね ね</span>
|
||||
<span title="U+306E">の の</span>
|
||||
<span title="U+306F">は は</span>
|
||||
<span title="U+3070">ば ば</span>
|
||||
<span title="U+3071">ぱ ぱ</span>
|
||||
<span title="U+3072">ひ ひ</span>
|
||||
<span title="U+3073">び び</span>
|
||||
<span title="U+3074">ぴ ぴ</span>
|
||||
<span title="U+3075">ふ ふ</span>
|
||||
<span title="U+3076">ぶ ぶ</span>
|
||||
<span title="U+3077">ぷ ぷ</span>
|
||||
<span title="U+3078">へ へ</span>
|
||||
<span title="U+3079">べ べ</span>
|
||||
<span title="U+307A">ぺ ぺ</span>
|
||||
<span title="U+307B">ほ ほ</span>
|
||||
<span title="U+307C">ぼ ぼ</span>
|
||||
<span title="U+307D">ぽ ぽ</span>
|
||||
<span title="U+307E">ま ま</span>
|
||||
<span title="U+307F">み み</span>
|
||||
<span title="U+3080">む む</span>
|
||||
<span title="U+3081">め め</span>
|
||||
<span title="U+3082">も も</span>
|
||||
<span title="U+3084">や や</span>
|
||||
<span title="U+3086">ゆ ゆ</span>
|
||||
<span title="U+3088">よ よ</span>
|
||||
<span title="U+3089">ら ら</span>
|
||||
<span title="U+308A">り り</span>
|
||||
<span title="U+308B">る る</span>
|
||||
<span title="U+308C">れ れ</span>
|
||||
<span title="U+308D">ろ ろ</span>
|
||||
<span title="U+308F">わ わ</span>
|
||||
<span title="U+3090">ゐ ゐ</span>
|
||||
<span title="U+3091">ゑ ゑ</span>
|
||||
<span title="U+3092">を を</span>
|
||||
<span title="U+3093">ん ん</span>
|
||||
<span title="U+30A2">ア ア</span>
|
||||
<span title="U+30A4">イ イ</span>
|
||||
<span title="U+30A6">ウ ウ</span>
|
||||
<span title="U+30A8">エ エ</span>
|
||||
<span title="U+30AA">オ オ</span>
|
||||
<span title="U+30AB">カ カ</span>
|
||||
<span title="U+30AC">ガ ガ</span>
|
||||
<span title="U+30AD">キ キ</span>
|
||||
<span title="U+30AE">ギ ギ</span>
|
||||
<span title="U+30AF">ク ク</span>
|
||||
<span title="U+30B0">グ グ</span>
|
||||
<span title="U+30B1">ケ ケ</span>
|
||||
<span title="U+30B2">ゲ ゲ</span>
|
||||
<span title="U+30B3">コ コ</span>
|
||||
<span title="U+30B4">ゴ ゴ</span>
|
||||
<span title="U+30B5">サ サ</span>
|
||||
<span title="U+30B6">ザ ザ</span>
|
||||
<span title="U+30B7">シ シ</span>
|
||||
<span title="U+30B8">ジ ジ</span>
|
||||
<span title="U+30B9">ス ス</span>
|
||||
<span title="U+30BA">ズ ズ</span>
|
||||
<span title="U+30BB">セ セ</span>
|
||||
<span title="U+30BC">ゼ ゼ</span>
|
||||
<span title="U+30BD">ソ ソ</span>
|
||||
<span title="U+30BE">ゾ ゾ</span>
|
||||
<span title="U+30BF">タ タ</span>
|
||||
<span title="U+30C0">ダ ダ</span>
|
||||
<span title="U+30C1">チ チ</span>
|
||||
<span title="U+30C2">ヂ ヂ</span>
|
||||
<span title="U+30C4">ツ ツ</span>
|
||||
<span title="U+30C5">ヅ ヅ</span>
|
||||
<span title="U+30C6">テ テ</span>
|
||||
<span title="U+30C7">デ デ</span>
|
||||
<span title="U+30C8">ト ト</span>
|
||||
<span title="U+30C9">ド ド</span>
|
||||
<span title="U+30CA">ナ ナ</span>
|
||||
<span title="U+30CB">ニ ニ</span>
|
||||
<span title="U+30CC">ヌ ヌ</span>
|
||||
<span title="U+30CD">ネ ネ</span>
|
||||
<span title="U+30CE">ノ ノ</span>
|
||||
<span title="U+30CF">ハ ハ</span>
|
||||
<span title="U+30D0">バ バ</span>
|
||||
<span title="U+30D1">パ パ</span>
|
||||
<span title="U+30D2">ヒ ヒ</span>
|
||||
<span title="U+30D3">ビ ビ</span>
|
||||
<span title="U+30D4">ピ ピ</span>
|
||||
<span title="U+30D5">フ フ</span>
|
||||
<span title="U+30D6">ブ ブ</span>
|
||||
<span title="U+30D7">プ プ</span>
|
||||
<span title="U+30D8">ヘ ヘ</span>
|
||||
<span title="U+30D9">ベ ベ</span>
|
||||
<span title="U+30DA">ペ ペ</span>
|
||||
<span title="U+30DB">ホ ホ</span>
|
||||
<span title="U+30DC">ボ ボ</span>
|
||||
<span title="U+30DD">ポ ポ</span>
|
||||
<span title="U+30DE">マ マ</span>
|
||||
<span title="U+30DF">ミ ミ</span>
|
||||
<span title="U+30E0">ム ム</span>
|
||||
<span title="U+30E1">メ メ</span>
|
||||
<span title="U+30E2">モ モ</span>
|
||||
<span title="U+30E4">ヤ ヤ</span>
|
||||
<span title="U+30E6">ユ ユ</span>
|
||||
<span title="U+30E8">ヨ ヨ</span>
|
||||
<span title="U+30E9">ラ ラ</span>
|
||||
<span title="U+30EA">リ リ</span>
|
||||
<span title="U+30EB">ル ル</span>
|
||||
<span title="U+30EC">レ レ</span>
|
||||
<span title="U+30ED">ロ ロ</span>
|
||||
<span title="U+30EF">ワ ワ</span>
|
||||
<span title="U+30F0">ヰ ヰ</span>
|
||||
<span title="U+30F1">ヱ ヱ</span>
|
||||
<span title="U+30F2">ヲ ヲ</span>
|
||||
<span title="U+30F3">ン ン</span>
|
||||
<span title="U+30F4">ヴ ヴ</span>
|
||||
<span title="U+309B">゛ ゛</span>
|
||||
<span title="U+309C">゜ ゜</span>
|
||||
<span title="U+FF60">｠ ｠</span>
|
||||
<span title="U+FF61">｡ ｡</span>
|
||||
<span title="U+FF62">｢ ｢</span>
|
||||
<span title="U+FF63">｣ ｣</span>
|
||||
<span title="U+FF64">､ ､</span>
|
||||
<span title="U+FF65">･ ･</span>
|
||||
<span title="U+FF66">ｦ ｦ</span>
|
||||
<span title="U+FF70">ｰ ｰ</span>
|
||||
<span title="U+FF71">ｱ ｱ</span>
|
||||
<span title="U+FF72">ｲ ｲ</span>
|
||||
<span title="U+FF73">ｳ ｳ</span>
|
||||
<span title="U+FF74">ｴ ｴ</span>
|
||||
<span title="U+FF75">ｵ ｵ</span>
|
||||
<span title="U+FF76">ｶ ｶ</span>
|
||||
<span title="U+FF77">ｷ ｷ</span>
|
||||
<span title="U+FF78">ｸ ｸ</span>
|
||||
<span title="U+FF79">ｹ ｹ</span>
|
||||
<span title="U+FF7A">ｺ ｺ</span>
|
||||
<span title="U+FF7B">ｻ ｻ</span>
|
||||
<span title="U+FF7C">ｼ ｼ</span>
|
||||
<span title="U+FF7D">ｽ ｽ</span>
|
||||
<span title="U+FF7E">ｾ ｾ</span>
|
||||
<span title="U+FF7F">ｿ ｿ</span>
|
||||
<span title="U+FF80">ﾀ ﾀ</span>
|
||||
<span title="U+FF81">ﾁ ﾁ</span>
|
||||
<span title="U+FF82">ﾂ ﾂ</span>
|
||||
<span title="U+FF83">ﾃ ﾃ</span>
|
||||
<span title="U+FF84">ﾄ ﾄ</span>
|
||||
<span title="U+FF85">ﾅ ﾅ</span>
|
||||
<span title="U+FF86">ﾆ ﾆ</span>
|
||||
<span title="U+FF87">ﾇ ﾇ</span>
|
||||
<span title="U+FF88">ﾈ ﾈ</span>
|
||||
<span title="U+FF89">ﾉ ﾉ</span>
|
||||
<span title="U+FF8A">ﾊ ﾊ</span>
|
||||
<span title="U+FF8B">ﾋ ﾋ</span>
|
||||
<span title="U+FF8C">ﾌ ﾌ</span>
|
||||
<span title="U+FF8D">ﾍ ﾍ</span>
|
||||
<span title="U+FF8E">ﾎ ﾎ</span>
|
||||
<span title="U+FF8F">ﾏ ﾏ</span>
|
||||
<span title="U+FF90">ﾐ ﾐ</span>
|
||||
<span title="U+FF91">ﾑ ﾑ</span>
|
||||
<span title="U+FF92">ﾒ ﾒ</span>
|
||||
<span title="U+FF93">ﾓ ﾓ</span>
|
||||
<span title="U+FF94">ﾔ ﾔ</span>
|
||||
<span title="U+FF95">ﾕ ﾕ</span>
|
||||
<span title="U+FF96">ﾖ ﾖ</span>
|
||||
<span title="U+FF97">ﾗ ﾗ</span>
|
||||
<span title="U+FF98">ﾘ ﾘ</span>
|
||||
<span title="U+FF99">ﾙ ﾙ</span>
|
||||
<span title="U+FF9A">ﾚ ﾚ</span>
|
||||
<span title="U+FF9B">ﾛ ﾛ</span>
|
||||
<span title="U+FF9C">ﾜ ﾜ</span>
|
||||
<span title="U+FF9D">ﾝ ﾝ</span>
|
||||
<span title="U+FF9E">ﾞ ﾞ</span>
|
||||
<span title="U+FF9F">ﾟ ﾟ</span>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
<p>Test passes if the characters in the second column are
|
||||
the same shape and size as those in the rightmost column,
|
||||
not small as those in the leftmost column.<br>
|
||||
Any missing glyph should be ignored as long as it is missing in both the second and the rightmost column.
|
||||
|
||||
<table>
|
||||
<tr><td>ァ<td>ア<td>ア
|
||||
<tr><td>ィ<td>イ<td>イ
|
||||
<tr><td>ゥ<td>ウ<td>ウ
|
||||
<tr><td>ェ<td>エ<td>エ
|
||||
<tr><td>ォ<td>オ<td>オ
|
||||
<tr><td>ヵ<td>カ<td>カ
|
||||
<tr><td>ㇰ<td>ク<td>ク
|
||||
<tr><td>ヶ<td>ケ<td>ケ
|
||||
<tr><td>ㇱ<td>シ<td>シ
|
||||
<tr><td>ㇲ<td>ス<td>ス
|
||||
<tr><td>ッ<td>ツ<td>ツ
|
||||
<tr><td>ㇳ<td>ト<td>ト
|
||||
<tr><td>ㇴ<td>ヌ<td>ヌ
|
||||
</table>
|
||||
|
|
|
|||
|
|
@ -0,0 +1,28 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Text level 3 Test Reference</title>
|
||||
<link rel="author" title="Florian Rivoal" href="https://florian.rivoal.net/">
|
||||
<link rel='author' title='Diego Pino Garcia' href='mailto:dpino@igalia.com'>
|
||||
|
||||
<p>Test passes if the characters in the second column are
|
||||
the same shape and size as those in the rightmost column,
|
||||
not small as those in the leftmost column.<br>
|
||||
Any missing glyph should be ignored as long as it is missing in both the second and the rightmost column.
|
||||
|
||||
<table>
|
||||
<tr><td>ㇵ<td>ハ<td>ハ
|
||||
<tr><td>ㇶ<td>ヒ<td>ヒ
|
||||
<tr><td>ㇷ<td>フ<td>フ
|
||||
<tr><td>ㇸ<td>ヘ<td>ヘ
|
||||
<tr><td>ㇹ<td>ホ<td>ホ
|
||||
<tr><td>ㇺ<td>ム<td>ム
|
||||
<tr><td>ャ<td>ヤ<td>ヤ
|
||||
<tr><td>ュ<td>ユ<td>ユ
|
||||
<tr><td>ョ<td>ヨ<td>ヨ
|
||||
<tr><td>ㇻ<td>ラ<td>ラ
|
||||
<tr><td>ㇼ<td>リ<td>リ
|
||||
<tr><td>ㇽ<td>ル<td>ル
|
||||
<tr><td>ㇾ<td>レ<td>レ
|
||||
<tr><td>ㇿ<td>ロ<td>ロ
|
||||
<tr><td>ヮ<td>ワ<td>ワ
|
||||
</table>
|
||||
|
|
@ -0,0 +1,22 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Text level 3 Test Reference</title>
|
||||
<link rel="author" title="Florian Rivoal" href="https://florian.rivoal.net/">
|
||||
<link rel='author' title='Diego Pino Garcia' href='mailto:dpino@igalia.com'>
|
||||
|
||||
<p>Test passes if the characters in the second column are
|
||||
the same shape and size as those in the rightmost column,
|
||||
not small as those in the leftmost column.<br>
|
||||
Any missing glyph should be ignored as long as it is missing in both the second and the rightmost column.
|
||||
|
||||
<table>
|
||||
<tr><td>ｧ<td>ｱ<td>ｱ
|
||||
<tr><td>ｨ<td>ｲ<td>ｲ
|
||||
<tr><td>ｩ<td>ｳ<td>ｳ
|
||||
<tr><td>ｪ<td>ｴ<td>ｴ
|
||||
<tr><td>ｫ<td>ｵ<td>ｵ
|
||||
<tr><td>ｯ<td>ﾂ<td>ﾂ
|
||||
<tr><td>ｬ<td>ﾔ<td>ﾔ
|
||||
<tr><td>ｭ<td>ﾕ<td>ﾕ
|
||||
<tr><td>ｮ<td>ﾖ<td>ﾖ
|
||||
</table>
|
||||
|
|
@ -0,0 +1,90 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS3 test reference</title>
|
||||
<link rel='author' title='Diego Pino Garcia' href='mailto:dpino@igalia.com'>
|
||||
<link rel='author' title='Florian Rivoal' href='https://florian.rivoal.net'>
|
||||
<style>
|
||||
div { font-size: 150%;}
|
||||
div > span { margin-right: 1em; white-space: nowrap; }
|
||||
</style>
|
||||
|
||||
<p>Test passes if both characters in each pair are the same shape <strong>and size</strong>.<br>
|
||||
Any missing glyph should be ignored
|
||||
as long as it is missing for both the first and second characters in a pair.
|
||||
|
||||
<div>
|
||||
<span>ー ー</span>
|
||||
<span>あ あ</span>
|
||||
<span>い い</span>
|
||||
<span>う う</span>
|
||||
<span>え え</span>
|
||||
<span>お お</span>
|
||||
<span>か か</span>
|
||||
<span>が が</span>
|
||||
<span>き き</span>
|
||||
<span>ぎ ぎ</span>
|
||||
<span>く く</span>
|
||||
<span>ぐ ぐ</span>
|
||||
<span>け け</span>
|
||||
<span>げ げ</span>
|
||||
<span>こ こ</span>
|
||||
<span>ご ご</span>
|
||||
<span>さ さ</span>
|
||||
<span>ざ ざ</span>
|
||||
<span>し し</span>
|
||||
<span>じ じ</span>
|
||||
<span>す す</span>
|
||||
<span>ず ず</span>
|
||||
<span>せ せ</span>
|
||||
<span>ぜ ぜ</span>
|
||||
<span>そ そ</span>
|
||||
<span>ぞ ぞ</span>
|
||||
<span>た た</span>
|
||||
<span>だ だ</span>
|
||||
<span>ち ち</span>
|
||||
<span>ぢ ぢ</span>
|
||||
<span>つ つ</span>
|
||||
<span>づ づ</span>
|
||||
<span>て て</span>
|
||||
<span>で で</span>
|
||||
<span>と と</span>
|
||||
<span>ど ど</span>
|
||||
<span>な な</span>
|
||||
<span>に に</span>
|
||||
<span>ぬ ぬ</span>
|
||||
<span>ね ね</span>
|
||||
<span>の の</span>
|
||||
<span>は は</span>
|
||||
<span>ば ば</span>
|
||||
<span>ぱ ぱ</span>
|
||||
<span>ひ ひ</span>
|
||||
<span>び び</span>
|
||||
<span>ぴ ぴ</span>
|
||||
<span>ふ ふ</span>
|
||||
<span>ぶ ぶ</span>
|
||||
<span>ぷ ぷ</span>
|
||||
<span>へ へ</span>
|
||||
<span>べ べ</span>
|
||||
<span>ぺ ぺ</span>
|
||||
<span>ほ ほ</span>
|
||||
<span>ぼ ぼ</span>
|
||||
<span>ぽ ぽ</span>
|
||||
<span>ま ま</span>
|
||||
<span>み み</span>
|
||||
<span>む む</span>
|
||||
<span>め め</span>
|
||||
<span>も も</span>
|
||||
<span>や や</span>
|
||||
<span>ゆ ゆ</span>
|
||||
<span>よ よ</span>
|
||||
<span>ら ら</span>
|
||||
<span>り り</span>
|
||||
<span>る る</span>
|
||||
<span>れ れ</span>
|
||||
<span>ろ ろ</span>
|
||||
<span>わ わ</span>
|
||||
<span>ゐ ゐ</span>
|
||||
<span>ゑ ゑ</span>
|
||||
<span>を を</span>
|
||||
<span>ん ん</span>
|
||||
</div>
|
||||
|
|
@ -0,0 +1,92 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS3 test reference</title>
|
||||
<link rel='author' title='Diego Pino Garcia' href='mailto:dpino@igalia.com'>
|
||||
<link rel='author' title='Florian Rivoal' href='https://florian.rivoal.net'>
|
||||
<style>
|
||||
div { font-size: 150%;}
|
||||
div > span { margin-right: 1em; white-space: nowrap; }
|
||||
</style>
|
||||
|
||||
<p>Test passes if both characters in each pair are the same shape <strong>and size</strong>.<br>
|
||||
Any missing glyph should be ignored
|
||||
as long as it is missing for both the first and second characters in a pair.
|
||||
|
||||
<div>
|
||||
<span>ア ア</span>
|
||||
<span>イ イ</span>
|
||||
<span>ウ ウ</span>
|
||||
<span>エ エ</span>
|
||||
<span>オ オ</span>
|
||||
<span>カ カ</span>
|
||||
<span>ガ ガ</span>
|
||||
<span>キ キ</span>
|
||||
<span>ギ ギ</span>
|
||||
<span>ク ク</span>
|
||||
<span>グ グ</span>
|
||||
<span>ケ ケ</span>
|
||||
<span>ゲ ゲ</span>
|
||||
<span>コ コ</span>
|
||||
<span>ゴ ゴ</span>
|
||||
<span>サ サ</span>
|
||||
<span>ザ ザ</span>
|
||||
<span>シ シ</span>
|
||||
<span>ジ ジ</span>
|
||||
<span>ス ス</span>
|
||||
<span>ズ ズ</span>
|
||||
<span>セ セ</span>
|
||||
<span>ゼ ゼ</span>
|
||||
<span>ソ ソ</span>
|
||||
<span>ゾ ゾ</span>
|
||||
<span>タ タ</span>
|
||||
<span>ダ ダ</span>
|
||||
<span>チ チ</span>
|
||||
<span>ヂ ヂ</span>
|
||||
<span>ツ ツ</span>
|
||||
<span>ヅ ヅ</span>
|
||||
<span>テ テ</span>
|
||||
<span>デ デ</span>
|
||||
<span>ト ト</span>
|
||||
<span>ド ド</span>
|
||||
<span>ナ ナ</span>
|
||||
<span>ニ ニ</span>
|
||||
<span>ヌ ヌ</span>
|
||||
<span>ネ ネ</span>
|
||||
<span>ノ ノ</span>
|
||||
<span>ハ ハ</span>
|
||||
<span>バ バ</span>
|
||||
<span>パ パ</span>
|
||||
<span>ヒ ヒ</span>
|
||||
<span>ビ ビ</span>
|
||||
<span>ピ ピ</span>
|
||||
<span>フ フ</span>
|
||||
<span>ブ ブ</span>
|
||||
<span>プ プ</span>
|
||||
<span>ヘ ヘ</span>
|
||||
<span>ベ ベ</span>
|
||||
<span>ペ ペ</span>
|
||||
<span>ホ ホ</span>
|
||||
<span>ボ ボ</span>
|
||||
<span>ポ ポ</span>
|
||||
<span>マ マ</span>
|
||||
<span>ミ ミ</span>
|
||||
<span>ム ム</span>
|
||||
<span>メ メ</span>
|
||||
<span>モ モ</span>
|
||||
<span>ヤ ヤ</span>
|
||||
<span>ユ ユ</span>
|
||||
<span>ヨ ヨ</span>
|
||||
<span>ラ ラ</span>
|
||||
<span>リ リ</span>
|
||||
<span>ル ル</span>
|
||||
<span>レ レ</span>
|
||||
<span>ロ ロ</span>
|
||||
<span>ワ ワ</span>
|
||||
<span>ヰ ヰ</span>
|
||||
<span>ヱ ヱ</span>
|
||||
<span>ヲ ヲ</span>
|
||||
<span>ン ン</span>
|
||||
<span>ヴ ヴ</span>
|
||||
<span>゛ ゛</span>
|
||||
<span>゜ ゜</span>
|
||||
</div>
|
||||
|
|
@ -0,0 +1,66 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS3 test reference</title>
|
||||
<link rel='author' title='Diego Pino Garcia' href='mailto:dpino@igalia.com'>
|
||||
<link rel='author' title='Florian Rivoal' href='https://florian.rivoal.net'>
|
||||
<style>
|
||||
div { font-size: 150%;}
|
||||
div > span { margin-right: 1em; white-space: nowrap; }
|
||||
</style>
|
||||
|
||||
<p>Test passes if both characters in each pair are the same shape <strong>and size</strong>.<br>
|
||||
Any missing glyph should be ignored
|
||||
as long as it is missing for both the first and second characters in a pair.
|
||||
|
||||
<div>
|
||||
<span>･ ･</span>
|
||||
<span>ｦ ｦ</span>
|
||||
<span>ｰ ｰ</span>
|
||||
<span>ｱ ｱ</span>
|
||||
<span>ｲ ｲ</span>
|
||||
<span>ｳ ｳ</span>
|
||||
<span>ｴ ｴ</span>
|
||||
<span>ｵ ｵ</span>
|
||||
<span>ｶ ｶ</span>
|
||||
<span>ｷ ｷ</span>
|
||||
<span>ｸ ｸ</span>
|
||||
<span>ｹ ｹ</span>
|
||||
<span>ｺ ｺ</span>
|
||||
<span>ｻ ｻ</span>
|
||||
<span>ｼ ｼ</span>
|
||||
<span>ｽ ｽ</span>
|
||||
<span>ｾ ｾ</span>
|
||||
<span>ｿ ｿ</span>
|
||||
<span>ﾀ ﾀ</span>
|
||||
<span>ﾁ ﾁ</span>
|
||||
<span>ﾂ ﾂ</span>
|
||||
<span>ﾃ ﾃ</span>
|
||||
<span>ﾄ ﾄ</span>
|
||||
<span>ﾅ ﾅ</span>
|
||||
<span>ﾆ ﾆ</span>
|
||||
<span>ﾇ ﾇ</span>
|
||||
<span>ﾈ ﾈ</span>
|
||||
<span>ﾉ ﾉ</span>
|
||||
<span>ﾊ ﾊ</span>
|
||||
<span>ﾋ ﾋ</span>
|
||||
<span>ﾌ ﾌ</span>
|
||||
<span>ﾍ ﾍ</span>
|
||||
<span>ﾎ ﾎ</span>
|
||||
<span>ﾏ ﾏ</span>
|
||||
<span>ﾐ ﾐ</span>
|
||||
<span>ﾑ ﾑ</span>
|
||||
<span>ﾒ ﾒ</span>
|
||||
<span>ﾓ ﾓ</span>
|
||||
<span>ﾔ ﾔ</span>
|
||||
<span>ﾕ ﾕ</span>
|
||||
<span>ﾖ ﾖ</span>
|
||||
<span>ﾗ ﾗ</span>
|
||||
<span>ﾘ ﾘ</span>
|
||||
<span>ﾙ ﾙ</span>
|
||||
<span>ﾚ ﾚ</span>
|
||||
<span>ﾛ ﾛ</span>
|
||||
<span>ﾜ ﾜ</span>
|
||||
<span>ﾝ ﾝ</span>
|
||||
<span>ﾞ ﾞ</span>
|
||||
<span>ﾟ ﾟ</span>
|
||||
</div>
|
||||
|
|
@ -0,0 +1,15 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Text Test reference</title>
|
||||
<link rel="author" title="Florian Rivoal" href="https://florian.rivoal.net/">
|
||||
<style>
|
||||
div { font-size: 4em; }
|
||||
body {
|
||||
max-width: 600px;
|
||||
max-width: max-content;
|
||||
}
|
||||
</style>
|
||||
|
||||
<p>Test passes if there are two identical strings below. Pay attention to the right-most character.
|
||||
<div dir=rtl lang=ar>عائلة</div>
|
||||
<div dir=rtl lang=ar>عائلة</div>
|
||||
|
|
@ -0,0 +1,31 @@
|
|||
<!doctype html>
|
||||
<meta charset=utf-8>
|
||||
<title>CSS Text 3 test: effects of text-transform on plain text copy&paste</title>
|
||||
<link rel=author title="Florian Rivoal" href="https://florian.rivoal.net">
|
||||
<link rel=help href="https://drafts.csswg.org/css-text-3/#text-transform-property">
|
||||
<meta name=flags content="interact">
|
||||
<meta name=assert content="text-transform must not affect the content of a plain text copy and paste operation.">
|
||||
<!--
|
||||
I wish this test could be written automatedly, but I don't think it can.
|
||||
We can work around the fact that document.execCommand(‘copy’) only works when triggered by user interactions
|
||||
by using test_driver.bless,
|
||||
but even then there's no way to read the content of the clipboard in an automated way:
|
||||
* document.execCommand(‘paste’) isn't supported in regular web pages by anyone but IE
|
||||
* The Clipboard API is not supported across the board,
|
||||
and Firefox only supports reading the clipboard in browser extensions,
|
||||
not in regular web pages.
|
||||
-->
|
||||
<style>
|
||||
div {
|
||||
text-transform: uppercase;
|
||||
border: solid 5px blue;
|
||||
}
|
||||
textarea { border: solid 5px orange; }
|
||||
div, textarea { padding: 1em; }
|
||||
</style>
|
||||
|
||||
<p>Copy the content of the blue box, then paste it in the orange box.
|
||||
<p>The test passes if the result is in lowercase.
|
||||
|
||||
<div id=source>there is no need to shout</div>
|
||||
<textarea></textarea>
|
||||
|
|
@ -1,71 +1,33 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8"/>
|
||||
<title>CSS3 Text, text transform: full-size-kana, small kanas</title>
|
||||
<meta name="assert" content="For small kanas, text-transform: full-size-kana puts all kanas in full-size kanas.">
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Text level 3 Test: Hiragana and text-transform: full-size-kana</title>
|
||||
<link rel="author" title="Florian Rivoal" href="https://florian.rivoal.net/">
|
||||
<link rel='author' title='Diego Pino Garcia' href='mailto:dpino@igalia.com'>
|
||||
<link rel='help' href='https://drafts.csswg.org/css-text-3/#text-transform'>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-text-3/#valdef-text-transform-full-size-kana">
|
||||
<link rel="match" href="reference/text-transform-full-size-kana-001-ref.html">
|
||||
<style type='text/css'>
|
||||
.test, .ref { font-size: 200%; line-height: 2.5em; }
|
||||
.test span, .ref span { margin-right: 1em; white-space: nowrap; }
|
||||
/* the CSS above is not part of the test */
|
||||
.test { text-transform: full-size-kana; }
|
||||
<meta name="assert" content="small hiragana are transformed to normal hiragana by text-tranform:full-size-kana">
|
||||
<style>
|
||||
td:nth-of-type(2) {
|
||||
text-transform: full-size-kana
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<p class="instructions">Test passes if both characters in each pair match. If you are missing a font glyph for a character, ignore that pair, but report which characters were ignored.</p>
|
||||
<div class="test">
|
||||
<span title="U+3041">ぁ あ</span>
|
||||
<span title="U+3043">ぃ い</span>
|
||||
<span title="U+3045">ぅ う</span>
|
||||
<span title="U+3047">ぇ え</span>
|
||||
<span title="U+3049">ぉ お</span>
|
||||
<span title="U+3095">ゕ か</span>
|
||||
<span title="U+3096">ゖ け</span>
|
||||
<span title="U+3063">っ つ</span>
|
||||
<span title="U+3083">ゃ や</span>
|
||||
<span title="U+3085">ゅ ゆ</span>
|
||||
<span title="U+3087">ょ よ</span>
|
||||
<span title="U+308E">ゎ わ</span>
|
||||
<span title="U+30A1">ァ ア</span>
|
||||
<span title="U+30A3">ィ イ</span>
|
||||
<span title="U+30A5">ゥ ウ</span>
|
||||
<span title="U+30A7">ェ エ</span>
|
||||
<span title="U+30A9">ォ オ</span>
|
||||
<span title="U+30F5">ヵ カ</span>
|
||||
<span title="U+31F0">ㇰ ク</span>
|
||||
<span title="U+30F6">ヶ ケ</span>
|
||||
<span title="U+31F1">ㇱ シ</span>
|
||||
<span title="U+31F2">ㇲ ス</span>
|
||||
<span title="U+30C3">ッ ツ</span>
|
||||
<span title="U+31F3">ㇳ ト</span>
|
||||
<span title="U+31F4">ㇴ ヌ</span>
|
||||
<span title="U+31F5">ㇵ ハ</span>
|
||||
<span title="U+31F6">ㇶ ヒ</span>
|
||||
<span title="U+31F7">ㇷ フ</span>
|
||||
<span title="U+31F8">ㇸ ヘ</span>
|
||||
<span title="U+31F9">ㇹ ホ</span>
|
||||
<span title="U+31FA">ㇺ ム</span>
|
||||
<span title="U+30E3">ャ ヤ</span>
|
||||
<span title="U+30E5">ュ ユ</span>
|
||||
<span title="U+30E7">ョ ヨ</span>
|
||||
<span title="U+31FB">ㇻ ラ</span>
|
||||
<span title="U+31FC">ㇼ リ</span>
|
||||
<span title="U+31FD">ㇽ ル</span>
|
||||
<span title="U+31FE">ㇾ レ</span>
|
||||
<span title="U+31FF">ㇿ ロ</span>
|
||||
<span title="U+30EE">ヮ ワ</span>
|
||||
<span title="U+FF67">ｧ ｱ</span>
|
||||
<span title="U+FF68">ｨ ｲ</span>
|
||||
<span title="U+FF69">ｩ ｳ</span>
|
||||
<span title="U+FF6A">ｪ ｴ</span>
|
||||
<span title="U+FF6B">ｫ ｵ</span>
|
||||
<span title="U+FF6F">ｯ ﾂ</span>
|
||||
<span title="U+FF6C">ｬ ﾔ</span>
|
||||
<span title="U+FF6D">ｭ ﾕ</span>
|
||||
<span title="U+FF6E">ｮ ﾖ</span>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
<p>Test passes if the characters in the second column are
|
||||
the same shape and size as those in the rightmost column,
|
||||
not small as those in the leftmost column.<br>
|
||||
Any missing glyph should be ignored as long as it is missing in both the second and the rightmost column.
|
||||
|
||||
<table>
|
||||
<tr><td>ぁ<td>ぁ<td>あ
|
||||
<tr><td>ぃ<td>ぃ<td>い
|
||||
<tr><td>ぅ<td>ぅ<td>う
|
||||
<tr><td>ぇ<td>ぇ<td>え
|
||||
<tr><td>ぉ<td>ぉ<td>お
|
||||
<tr><td>ゕ<td>ゕ<td>か
|
||||
<tr><td>ゖ<td>ゖ<td>け
|
||||
<tr><td>っ<td>っ<td>つ
|
||||
<tr><td>ゃ<td>ゃ<td>や
|
||||
<tr><td>ゅ<td>ゅ<td>ゆ
|
||||
<tr><td>ょ<td>ょ<td>よ
|
||||
<tr><td>ゎ<td>ゎ<td>わ
|
||||
</table>
|
||||
|
|
|
|||
|
|
@ -1,227 +1,34 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8"/>
|
||||
<title>CSS3 Text, text transform: full-size-kana, full-size kanas</title>
|
||||
<meta name="assert" content="For full-size kanas, text-transform: full-size-kana leaves all kanas unaltered.">
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Text level 3 Test: Katakana and text-transform: full-size-kana</title>
|
||||
<link rel="author" title="Florian Rivoal" href="https://florian.rivoal.net/">
|
||||
<link rel='author' title='Diego Pino Garcia' href='mailto:dpino@igalia.com'>
|
||||
<link rel='help' href='https://drafts.csswg.org/css-text-3/#text-transform'>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-text-3/#valdef-text-transform-full-size-kana">
|
||||
<link rel="match" href="reference/text-transform-full-size-kana-002-ref.html">
|
||||
<style type='text/css'>
|
||||
.test, .ref { font-size: 200%; line-height: 2.5em; }
|
||||
.test span, .ref span { margin-right: 1em; white-space: nowrap; }
|
||||
/* the CSS above is not part of the test */
|
||||
.test { text-transform: full-size-kana; }
|
||||
<meta name="assert" content="small katakana are transformed to normal katakana by text-tranform:full-size-kana (part 1)">
|
||||
<style>
|
||||
td:nth-of-type(2) {
|
||||
text-transform: full-size-kana
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<p class="instructions">Test passes if both characters in each pair match. If you are missing a font glyph for a character, ignore that pair, but report which characters were ignored.</p>
|
||||
<div class="test">
|
||||
<span title="U+30FC">ー ー</span>
|
||||
<span title="U+3042">あ あ</span>
|
||||
<span title="U+3044">い い</span>
|
||||
<span title="U+3046">う う</span>
|
||||
<span title="U+3048">え え</span>
|
||||
<span title="U+304A">お お</span>
|
||||
<span title="U+304B">か か</span>
|
||||
<span title="U+304C">が が</span>
|
||||
<span title="U+304D">き き</span>
|
||||
<span title="U+304E">ぎ ぎ</span>
|
||||
<span title="U+304F">く く</span>
|
||||
<span title="U+3050">ぐ ぐ</span>
|
||||
<span title="U+3051">け け</span>
|
||||
<span title="U+3052">げ げ</span>
|
||||
<span title="U+3053">こ こ</span>
|
||||
<span title="U+3054">ご ご</span>
|
||||
<span title="U+3055">さ さ</span>
|
||||
<span title="U+3056">ざ ざ</span>
|
||||
<span title="U+3057">し し</span>
|
||||
<span title="U+3058">じ じ</span>
|
||||
<span title="U+3059">す す</span>
|
||||
<span title="U+305A">ず ず</span>
|
||||
<span title="U+305B">せ せ</span>
|
||||
<span title="U+305C">ぜ ぜ</span>
|
||||
<span title="U+305D">そ そ</span>
|
||||
<span title="U+305E">ぞ ぞ</span>
|
||||
<span title="U+305F">た た</span>
|
||||
<span title="U+3060">だ だ</span>
|
||||
<span title="U+3061">ち ち</span>
|
||||
<span title="U+3062">ぢ ぢ</span>
|
||||
<span title="U+3064">つ つ</span>
|
||||
<span title="U+3065">づ づ</span>
|
||||
<span title="U+3066">て て</span>
|
||||
<span title="U+3067">で で</span>
|
||||
<span title="U+3068">と と</span>
|
||||
<span title="U+3069">ど ど</span>
|
||||
<span title="U+306A">な な</span>
|
||||
<span title="U+306B">に に</span>
|
||||
<span title="U+306C">ぬ ぬ</span>
|
||||
<span title="U+306D">ね ね</span>
|
||||
<span title="U+306E">の の</span>
|
||||
<span title="U+306F">は は</span>
|
||||
<span title="U+3070">ば ば</span>
|
||||
<span title="U+3071">ぱ ぱ</span>
|
||||
<span title="U+3072">ひ ひ</span>
|
||||
<span title="U+3073">び び</span>
|
||||
<span title="U+3074">ぴ ぴ</span>
|
||||
<span title="U+3075">ふ ふ</span>
|
||||
<span title="U+3076">ぶ ぶ</span>
|
||||
<span title="U+3077">ぷ ぷ</span>
|
||||
<span title="U+3078">へ へ</span>
|
||||
<span title="U+3079">べ べ</span>
|
||||
<span title="U+307A">ぺ ぺ</span>
|
||||
<span title="U+307B">ほ ほ</span>
|
||||
<span title="U+307C">ぼ ぼ</span>
|
||||
<span title="U+307D">ぽ ぽ</span>
|
||||
<span title="U+307E">ま ま</span>
|
||||
<span title="U+307F">み み</span>
|
||||
<span title="U+3080">む む</span>
|
||||
<span title="U+3081">め め</span>
|
||||
<span title="U+3082">も も</span>
|
||||
<span title="U+3084">や や</span>
|
||||
<span title="U+3086">ゆ ゆ</span>
|
||||
<span title="U+3088">よ よ</span>
|
||||
<span title="U+3089">ら ら</span>
|
||||
<span title="U+308A">り り</span>
|
||||
<span title="U+308B">る る</span>
|
||||
<span title="U+308C">れ れ</span>
|
||||
<span title="U+308D">ろ ろ</span>
|
||||
<span title="U+308F">わ わ</span>
|
||||
<span title="U+3090">ゐ ゐ</span>
|
||||
<span title="U+3091">ゑ ゑ</span>
|
||||
<span title="U+3092">を を</span>
|
||||
<span title="U+3093">ん ん</span>
|
||||
<span title="U+30A2">ア ア</span>
|
||||
<span title="U+30A4">イ イ</span>
|
||||
<span title="U+30A6">ウ ウ</span>
|
||||
<span title="U+30A8">エ エ</span>
|
||||
<span title="U+30AA">オ オ</span>
|
||||
<span title="U+30AB">カ カ</span>
|
||||
<span title="U+30AC">ガ ガ</span>
|
||||
<span title="U+30AD">キ キ</span>
|
||||
<span title="U+30AE">ギ ギ</span>
|
||||
<span title="U+30AF">ク ク</span>
|
||||
<span title="U+30B0">グ グ</span>
|
||||
<span title="U+30B1">ケ ケ</span>
|
||||
<span title="U+30B2">ゲ ゲ</span>
|
||||
<span title="U+30B3">コ コ</span>
|
||||
<span title="U+30B4">ゴ ゴ</span>
|
||||
<span title="U+30B5">サ サ</span>
|
||||
<span title="U+30B6">ザ ザ</span>
|
||||
<span title="U+30B7">シ シ</span>
|
||||
<span title="U+30B8">ジ ジ</span>
|
||||
<span title="U+30B9">ス ス</span>
|
||||
<span title="U+30BA">ズ ズ</span>
|
||||
<span title="U+30BB">セ セ</span>
|
||||
<span title="U+30BC">ゼ ゼ</span>
|
||||
<span title="U+30BD">ソ ソ</span>
|
||||
<span title="U+30BE">ゾ ゾ</span>
|
||||
<span title="U+30BF">タ タ</span>
|
||||
<span title="U+30C0">ダ ダ</span>
|
||||
<span title="U+30C1">チ チ</span>
|
||||
<span title="U+30C2">ヂ ヂ</span>
|
||||
<span title="U+30C4">ツ ツ</span>
|
||||
<span title="U+30C5">ヅ ヅ</span>
|
||||
<span title="U+30C6">テ テ</span>
|
||||
<span title="U+30C7">デ デ</span>
|
||||
<span title="U+30C8">ト ト</span>
|
||||
<span title="U+30C9">ド ド</span>
|
||||
<span title="U+30CA">ナ ナ</span>
|
||||
<span title="U+30CB">ニ ニ</span>
|
||||
<span title="U+30CC">ヌ ヌ</span>
|
||||
<span title="U+30CD">ネ ネ</span>
|
||||
<span title="U+30CE">ノ ノ</span>
|
||||
<span title="U+30CF">ハ ハ</span>
|
||||
<span title="U+30D0">バ バ</span>
|
||||
<span title="U+30D1">パ パ</span>
|
||||
<span title="U+30D2">ヒ ヒ</span>
|
||||
<span title="U+30D3">ビ ビ</span>
|
||||
<span title="U+30D4">ピ ピ</span>
|
||||
<span title="U+30D5">フ フ</span>
|
||||
<span title="U+30D6">ブ ブ</span>
|
||||
<span title="U+30D7">プ プ</span>
|
||||
<span title="U+30D8">ヘ ヘ</span>
|
||||
<span title="U+30D9">ベ ベ</span>
|
||||
<span title="U+30DA">ペ ペ</span>
|
||||
<span title="U+30DB">ホ ホ</span>
|
||||
<span title="U+30DC">ボ ボ</span>
|
||||
<span title="U+30DD">ポ ポ</span>
|
||||
<span title="U+30DE">マ マ</span>
|
||||
<span title="U+30DF">ミ ミ</span>
|
||||
<span title="U+30E0">ム ム</span>
|
||||
<span title="U+30E1">メ メ</span>
|
||||
<span title="U+30E2">モ モ</span>
|
||||
<span title="U+30E4">ヤ ヤ</span>
|
||||
<span title="U+30E6">ユ ユ</span>
|
||||
<span title="U+30E8">ヨ ヨ</span>
|
||||
<span title="U+30E9">ラ ラ</span>
|
||||
<span title="U+30EA">リ リ</span>
|
||||
<span title="U+30EB">ル ル</span>
|
||||
<span title="U+30EC">レ レ</span>
|
||||
<span title="U+30ED">ロ ロ</span>
|
||||
<span title="U+30EF">ワ ワ</span>
|
||||
<span title="U+30F0">ヰ ヰ</span>
|
||||
<span title="U+30F1">ヱ ヱ</span>
|
||||
<span title="U+30F2">ヲ ヲ</span>
|
||||
<span title="U+30F3">ン ン</span>
|
||||
<span title="U+30F4">ヴ ヴ</span>
|
||||
<span title="U+309B">゛ ゛</span>
|
||||
<span title="U+309C">゜ ゜</span>
|
||||
<span title="U+FF60">｠ ｠</span>
|
||||
<span title="U+FF61">｡ ｡</span>
|
||||
<span title="U+FF62">｢ ｢</span>
|
||||
<span title="U+FF63">｣ ｣</span>
|
||||
<span title="U+FF64">､ ､</span>
|
||||
<span title="U+FF65">･ ･</span>
|
||||
<span title="U+FF66">ｦ ｦ</span>
|
||||
<span title="U+FF70">ｰ ｰ</span>
|
||||
<span title="U+FF71">ｱ ｱ</span>
|
||||
<span title="U+FF72">ｲ ｲ</span>
|
||||
<span title="U+FF73">ｳ ｳ</span>
|
||||
<span title="U+FF74">ｴ ｴ</span>
|
||||
<span title="U+FF75">ｵ ｵ</span>
|
||||
<span title="U+FF76">ｶ ｶ</span>
|
||||
<span title="U+FF77">ｷ ｷ</span>
|
||||
<span title="U+FF78">ｸ ｸ</span>
|
||||
<span title="U+FF79">ｹ ｹ</span>
|
||||
<span title="U+FF7A">ｺ ｺ</span>
|
||||
<span title="U+FF7B">ｻ ｻ</span>
|
||||
<span title="U+FF7C">ｼ ｼ</span>
|
||||
<span title="U+FF7D">ｽ ｽ</span>
|
||||
<span title="U+FF7E">ｾ ｾ</span>
|
||||
<span title="U+FF7F">ｿ ｿ</span>
|
||||
<span title="U+FF80">ﾀ ﾀ</span>
|
||||
<span title="U+FF81">ﾁ ﾁ</span>
|
||||
<span title="U+FF82">ﾂ ﾂ</span>
|
||||
<span title="U+FF83">ﾃ ﾃ</span>
|
||||
<span title="U+FF84">ﾄ ﾄ</span>
|
||||
<span title="U+FF85">ﾅ ﾅ</span>
|
||||
<span title="U+FF86">ﾆ ﾆ</span>
|
||||
<span title="U+FF87">ﾇ ﾇ</span>
|
||||
<span title="U+FF88">ﾈ ﾈ</span>
|
||||
<span title="U+FF89">ﾉ ﾉ</span>
|
||||
<span title="U+FF8A">ﾊ ﾊ</span>
|
||||
<span title="U+FF8B">ﾋ ﾋ</span>
|
||||
<span title="U+FF8C">ﾌ ﾌ</span>
|
||||
<span title="U+FF8D">ﾍ ﾍ</span>
|
||||
<span title="U+FF8E">ﾎ ﾎ</span>
|
||||
<span title="U+FF8F">ﾏ ﾏ</span>
|
||||
<span title="U+FF90">ﾐ ﾐ</span>
|
||||
<span title="U+FF91">ﾑ ﾑ</span>
|
||||
<span title="U+FF92">ﾒ ﾒ</span>
|
||||
<span title="U+FF93">ﾓ ﾓ</span>
|
||||
<span title="U+FF94">ﾔ ﾔ</span>
|
||||
<span title="U+FF95">ﾕ ﾕ</span>
|
||||
<span title="U+FF96">ﾖ ﾖ</span>
|
||||
<span title="U+FF97">ﾗ ﾗ</span>
|
||||
<span title="U+FF98">ﾘ ﾘ</span>
|
||||
<span title="U+FF99">ﾙ ﾙ</span>
|
||||
<span title="U+FF9A">ﾚ ﾚ</span>
|
||||
<span title="U+FF9B">ﾛ ﾛ</span>
|
||||
<span title="U+FF9C">ﾜ ﾜ</span>
|
||||
<span title="U+FF9D">ﾝ ﾝ</span>
|
||||
<span title="U+FF9E">ﾞ ﾞ</span>
|
||||
<span title="U+FF9F">ﾟ ﾟ</span>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
<p>Test passes if the characters in the second column are
|
||||
the same shape and size as those in the rightmost column,
|
||||
not small as those in the leftmost column.<br>
|
||||
Any missing glyph should be ignored as long as it is missing in both the second and the rightmost column.
|
||||
|
||||
<table>
|
||||
<tr><td>ァ<td>ァ<td>ア
|
||||
<tr><td>ィ<td>ィ<td>イ
|
||||
<tr><td>ゥ<td>ゥ<td>ウ
|
||||
<tr><td>ェ<td>ェ<td>エ
|
||||
<tr><td>ォ<td>ォ<td>オ
|
||||
<tr><td>ヵ<td>ヵ<td>カ
|
||||
<tr><td>ㇰ<td>ㇰ<td>ク
|
||||
<tr><td>ヶ<td>ヶ<td>ケ
|
||||
<tr><td>ㇱ<td>ㇱ<td>シ
|
||||
<tr><td>ㇲ<td>ㇲ<td>ス
|
||||
<tr><td>ッ<td>ッ<td>ツ
|
||||
<tr><td>ㇳ<td>ㇳ<td>ト
|
||||
<tr><td>ㇴ<td>ㇴ<td>ヌ
|
||||
</table>
|
||||
|
|
|
|||
|
|
@ -0,0 +1,36 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Text level 3 Test: Katakana and text-transform: full-size-kana</title>
|
||||
<link rel="author" title="Florian Rivoal" href="https://florian.rivoal.net/">
|
||||
<link rel='author' title='Diego Pino Garcia' href='mailto:dpino@igalia.com'>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-text-3/#valdef-text-transform-full-size-kana">
|
||||
<link rel="match" href="reference/text-transform-full-size-kana-003-ref.html">
|
||||
<meta name="assert" content="small katakana are transformed to normal katakana by text-tranform:full-size-kana (part 2)">
|
||||
<style>
|
||||
td:nth-of-type(2) {
|
||||
text-transform: full-size-kana
|
||||
}
|
||||
</style>
|
||||
|
||||
<p>Test passes if the characters in the second column are
|
||||
the same shape and size as those in the rightmost column,
|
||||
not small as those in the leftmost column.<br>
|
||||
Any missing glyph should be ignored as long as it is missing in both the second and the rightmost column.
|
||||
|
||||
<table>
|
||||
<tr><td>ㇵ<td>ㇵ<td>ハ
|
||||
<tr><td>ㇶ<td>ㇶ<td>ヒ
|
||||
<tr><td>ㇷ<td>ㇷ<td>フ
|
||||
<tr><td>ㇸ<td>ㇸ<td>ヘ
|
||||
<tr><td>ㇹ<td>ㇹ<td>ホ
|
||||
<tr><td>ㇺ<td>ㇺ<td>ム
|
||||
<tr><td>ャ<td>ャ<td>ヤ
|
||||
<tr><td>ュ<td>ュ<td>ユ
|
||||
<tr><td>ョ<td>ョ<td>ヨ
|
||||
<tr><td>ㇻ<td>ㇻ<td>ラ
|
||||
<tr><td>ㇼ<td>ㇼ<td>リ
|
||||
<tr><td>ㇽ<td>ㇽ<td>ル
|
||||
<tr><td>ㇾ<td>ㇾ<td>レ
|
||||
<tr><td>ㇿ<td>ㇿ<td>ロ
|
||||
<tr><td>ヮ<td>ヮ<td>ワ
|
||||
</table>
|
||||
|
|
@ -0,0 +1,30 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Text level 3 Test: half-width Katakana and text-transform: full-size-kana</title>
|
||||
<link rel="author" title="Florian Rivoal" href="https://florian.rivoal.net/">
|
||||
<link rel='author' title='Diego Pino Garcia' href='mailto:dpino@igalia.com'>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-text-3/#valdef-text-transform-full-size-kana">
|
||||
<link rel="match" href="reference/text-transform-full-size-kana-004-ref.html">
|
||||
<meta name="assert" content="small half-width katakana are transformed to normal half-width katakana by text-tranform:full-size-kana">
|
||||
<style>
|
||||
td:nth-of-type(2) {
|
||||
text-transform: full-size-kana
|
||||
}
|
||||
</style>
|
||||
|
||||
<p>Test passes if the characters in the second column are
|
||||
the same shape and size as those in the rightmost column,
|
||||
not small as those in the leftmost column.<br>
|
||||
Any missing glyph should be ignored as long as it is missing in both the second and the rightmost column.
|
||||
|
||||
<table>
|
||||
<tr><td>ｧ<td>ｧ<td>ｱ
|
||||
<tr><td>ｨ<td>ｨ<td>ｲ
|
||||
<tr><td>ｩ<td>ｩ<td>ｳ
|
||||
<tr><td>ｪ<td>ｪ<td>ｴ
|
||||
<tr><td>ｫ<td>ｫ<td>ｵ
|
||||
<tr><td>ｯ<td>ｯ<td>ﾂ
|
||||
<tr><td>ｬ<td>ｬ<td>ﾔ
|
||||
<tr><td>ｭ<td>ｭ<td>ﾕ
|
||||
<tr><td>ｮ<td>ｮ<td>ﾖ
|
||||
</table>
|
||||
|
|
@ -0,0 +1,95 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS3 Text, text transform: full-size-kana, full-size kanas, hiragana</title>
|
||||
<meta name="assert" content="For full-size kanas, text-transform: full-size-kana leaves all kanas unaltered (testing the hiragana subset).">
|
||||
<link rel='author' title='Diego Pino Garcia' href='mailto:dpino@igalia.com'>
|
||||
<link rel='author' title='Florian Rivoal' href='https://florian.rivoal.net'>
|
||||
<link rel='help' href='https://drafts.csswg.org/css-text-3/#text-transform'>
|
||||
<link rel="match" href="reference/text-transform-full-size-kana-005-ref.html">
|
||||
<style>
|
||||
div { font-size: 150%;}
|
||||
div > span { margin-right: 1em; white-space: nowrap; }
|
||||
/* the CSS above is not part of the test */
|
||||
.test { text-transform: full-size-kana; }
|
||||
</style>
|
||||
|
||||
<p>Test passes if both characters in each pair are the same shape <strong>and size</strong>.<br>
|
||||
Any missing glyph should be ignored
|
||||
as long as it is missing for both the first and second characters in a pair.
|
||||
|
||||
<div>
|
||||
<span><span class=test>ー</span> ー</span>
|
||||
<span><span class=test>あ</span> あ</span>
|
||||
<span><span class=test>い</span> い</span>
|
||||
<span><span class=test>う</span> う</span>
|
||||
<span><span class=test>え</span> え</span>
|
||||
<span><span class=test>お</span> お</span>
|
||||
<span><span class=test>か</span> か</span>
|
||||
<span><span class=test>が</span> が</span>
|
||||
<span><span class=test>き</span> き</span>
|
||||
<span><span class=test>ぎ</span> ぎ</span>
|
||||
<span><span class=test>く</span> く</span>
|
||||
<span><span class=test>ぐ</span> ぐ</span>
|
||||
<span><span class=test>け</span> け</span>
|
||||
<span><span class=test>げ</span> げ</span>
|
||||
<span><span class=test>こ</span> こ</span>
|
||||
<span><span class=test>ご</span> ご</span>
|
||||
<span><span class=test>さ</span> さ</span>
|
||||
<span><span class=test>ざ</span> ざ</span>
|
||||
<span><span class=test>し</span> し</span>
|
||||
<span><span class=test>じ</span> じ</span>
|
||||
<span><span class=test>す</span> す</span>
|
||||
<span><span class=test>ず</span> ず</span>
|
||||
<span><span class=test>せ</span> せ</span>
|
||||
<span><span class=test>ぜ</span> ぜ</span>
|
||||
<span><span class=test>そ</span> そ</span>
|
||||
<span><span class=test>ぞ</span> ぞ</span>
|
||||
<span><span class=test>た</span> た</span>
|
||||
<span><span class=test>だ</span> だ</span>
|
||||
<span><span class=test>ち</span> ち</span>
|
||||
<span><span class=test>ぢ</span> ぢ</span>
|
||||
<span><span class=test>つ</span> つ</span>
|
||||
<span><span class=test>づ</span> づ</span>
|
||||
<span><span class=test>て</span> て</span>
|
||||
<span><span class=test>で</span> で</span>
|
||||
<span><span class=test>と</span> と</span>
|
||||
<span><span class=test>ど</span> ど</span>
|
||||
<span><span class=test>な</span> な</span>
|
||||
<span><span class=test>に</span> に</span>
|
||||
<span><span class=test>ぬ</span> ぬ</span>
|
||||
<span><span class=test>ね</span> ね</span>
|
||||
<span><span class=test>の</span> の</span>
|
||||
<span><span class=test>は</span> は</span>
|
||||
<span><span class=test>ば</span> ば</span>
|
||||
<span><span class=test>ぱ</span> ぱ</span>
|
||||
<span><span class=test>ひ</span> ひ</span>
|
||||
<span><span class=test>び</span> び</span>
|
||||
<span><span class=test>ぴ</span> ぴ</span>
|
||||
<span><span class=test>ふ</span> ふ</span>
|
||||
<span><span class=test>ぶ</span> ぶ</span>
|
||||
<span><span class=test>ぷ</span> ぷ</span>
|
||||
<span><span class=test>へ</span> へ</span>
|
||||
<span><span class=test>べ</span> べ</span>
|
||||
<span><span class=test>ぺ</span> ぺ</span>
|
||||
<span><span class=test>ほ</span> ほ</span>
|
||||
<span><span class=test>ぼ</span> ぼ</span>
|
||||
<span><span class=test>ぽ</span> ぽ</span>
|
||||
<span><span class=test>ま</span> ま</span>
|
||||
<span><span class=test>み</span> み</span>
|
||||
<span><span class=test>む</span> む</span>
|
||||
<span><span class=test>め</span> め</span>
|
||||
<span><span class=test>も</span> も</span>
|
||||
<span><span class=test>や</span> や</span>
|
||||
<span><span class=test>ゆ</span> ゆ</span>
|
||||
<span><span class=test>よ</span> よ</span>
|
||||
<span><span class=test>ら</span> ら</span>
|
||||
<span><span class=test>り</span> り</span>
|
||||
<span><span class=test>る</span> る</span>
|
||||
<span><span class=test>れ</span> れ</span>
|
||||
<span><span class=test>ろ</span> ろ</span>
|
||||
<span><span class=test>わ</span> わ</span>
|
||||
<span><span class=test>ゐ</span> ゐ</span>
|
||||
<span><span class=test>ゑ</span> ゑ</span>
|
||||
<span><span class=test>を</span> を</span>
|
||||
<span><span class=test>ん</span> ん</span>
|
||||
</div>
|
||||
|
|
@ -0,0 +1,97 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS3 Text, text transform: full-size-kana, full-size kanas, katakana</title>
|
||||
<meta name="assert" content="For full-size kanas, text-transform: full-size-kana leaves all kanas unaltered (testing the katakana subset).">
|
||||
<link rel='author' title='Diego Pino Garcia' href='mailto:dpino@igalia.com'>
|
||||
<link rel='author' title='Florian Rivoal' href='https://florian.rivoal.net'>
|
||||
<link rel='help' href='https://drafts.csswg.org/css-text-3/#text-transform'>
|
||||
<link rel="match" href="reference/text-transform-full-size-kana-006-ref.html">
|
||||
<style>
|
||||
div { font-size: 150%;}
|
||||
div > span { margin-right: 1em; white-space: nowrap; }
|
||||
/* the CSS above is not part of the test */
|
||||
.test { text-transform: full-size-kana; }
|
||||
</style>
|
||||
|
||||
<p>Test passes if both characters in each pair are the same shape <strong>and size</strong>.<br>
|
||||
Any missing glyph should be ignored
|
||||
as long as it is missing for both the first and second characters in a pair.
|
||||
|
||||
<div>
|
||||
<span><span class=test>ア</span> ア</span>
|
||||
<span><span class=test>イ</span> イ</span>
|
||||
<span><span class=test>ウ</span> ウ</span>
|
||||
<span><span class=test>エ</span> エ</span>
|
||||
<span><span class=test>オ</span> オ</span>
|
||||
<span><span class=test>カ</span> カ</span>
|
||||
<span><span class=test>ガ</span> ガ</span>
|
||||
<span><span class=test>キ</span> キ</span>
|
||||
<span><span class=test>ギ</span> ギ</span>
|
||||
<span><span class=test>ク</span> ク</span>
|
||||
<span><span class=test>グ</span> グ</span>
|
||||
<span><span class=test>ケ</span> ケ</span>
|
||||
<span><span class=test>ゲ</span> ゲ</span>
|
||||
<span><span class=test>コ</span> コ</span>
|
||||
<span><span class=test>ゴ</span> ゴ</span>
|
||||
<span><span class=test>サ</span> サ</span>
|
||||
<span><span class=test>ザ</span> ザ</span>
|
||||
<span><span class=test>シ</span> シ</span>
|
||||
<span><span class=test>ジ</span> ジ</span>
|
||||
<span><span class=test>ス</span> ス</span>
|
||||
<span><span class=test>ズ</span> ズ</span>
|
||||
<span><span class=test>セ</span> セ</span>
|
||||
<span><span class=test>ゼ</span> ゼ</span>
|
||||
<span><span class=test>ソ</span> ソ</span>
|
||||
<span><span class=test>ゾ</span> ゾ</span>
|
||||
<span><span class=test>タ</span> タ</span>
|
||||
<span><span class=test>ダ</span> ダ</span>
|
||||
<span><span class=test>チ</span> チ</span>
|
||||
<span><span class=test>ヂ</span> ヂ</span>
|
||||
<span><span class=test>ツ</span> ツ</span>
|
||||
<span><span class=test>ヅ</span> ヅ</span>
|
||||
<span><span class=test>テ</span> テ</span>
|
||||
<span><span class=test>デ</span> デ</span>
|
||||
<span><span class=test>ト</span> ト</span>
|
||||
<span><span class=test>ド</span> ド</span>
|
||||
<span><span class=test>ナ</span> ナ</span>
|
||||
<span><span class=test>ニ</span> ニ</span>
|
||||
<span><span class=test>ヌ</span> ヌ</span>
|
||||
<span><span class=test>ネ</span> ネ</span>
|
||||
<span><span class=test>ノ</span> ノ</span>
|
||||
<span><span class=test>ハ</span> ハ</span>
|
||||
<span><span class=test>バ</span> バ</span>
|
||||
<span><span class=test>パ</span> パ</span>
|
||||
<span><span class=test>ヒ</span> ヒ</span>
|
||||
<span><span class=test>ビ</span> ビ</span>
|
||||
<span><span class=test>ピ</span> ピ</span>
|
||||
<span><span class=test>フ</span> フ</span>
|
||||
<span><span class=test>ブ</span> ブ</span>
|
||||
<span><span class=test>プ</span> プ</span>
|
||||
<span><span class=test>ヘ</span> ヘ</span>
|
||||
<span><span class=test>ベ</span> ベ</span>
|
||||
<span><span class=test>ペ</span> ペ</span>
|
||||
<span><span class=test>ホ</span> ホ</span>
|
||||
<span><span class=test>ボ</span> ボ</span>
|
||||
<span><span class=test>ポ</span> ポ</span>
|
||||
<span><span class=test>マ</span> マ</span>
|
||||
<span><span class=test>ミ</span> ミ</span>
|
||||
<span><span class=test>ム</span> ム</span>
|
||||
<span><span class=test>メ</span> メ</span>
|
||||
<span><span class=test>モ</span> モ</span>
|
||||
<span><span class=test>ヤ</span> ヤ</span>
|
||||
<span><span class=test>ユ</span> ユ</span>
|
||||
<span><span class=test>ヨ</span> ヨ</span>
|
||||
<span><span class=test>ラ</span> ラ</span>
|
||||
<span><span class=test>リ</span> リ</span>
|
||||
<span><span class=test>ル</span> ル</span>
|
||||
<span><span class=test>レ</span> レ</span>
|
||||
<span><span class=test>ロ</span> ロ</span>
|
||||
<span><span class=test>ワ</span> ワ</span>
|
||||
<span><span class=test>ヰ</span> ヰ</span>
|
||||
<span><span class=test>ヱ</span> ヱ</span>
|
||||
<span><span class=test>ヲ</span> ヲ</span>
|
||||
<span><span class=test>ン</span> ン</span>
|
||||
<span><span class=test>ヴ</span> ヴ</span>
|
||||
<span><span class=test>゛</span> ゛</span>
|
||||
<span><span class=test>゜</span> ゜</span>
|
||||
</div>
|
||||
|
|
@ -0,0 +1,71 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS3 Text, text transform: full-size-kana, full-size kanas, half-width katakana</title>
|
||||
<meta name="assert" content="For full-size kanas, text-transform: full-size-kana leaves all kanas unaltered (testing the half-wdith katakana subset).">
|
||||
<link rel='author' title='Diego Pino Garcia' href='mailto:dpino@igalia.com'>
|
||||
<link rel='author' title='Florian Rivoal' href='https://florian.rivoal.net'>
|
||||
<link rel='help' href='https://drafts.csswg.org/css-text-3/#text-transform'>
|
||||
<link rel="match" href="reference/text-transform-full-size-kana-007-ref.html">
|
||||
<style>
|
||||
div { font-size: 150%;}
|
||||
div > span { margin-right: 1em; white-space: nowrap; }
|
||||
/* the CSS above is not part of the test */
|
||||
.test { text-transform: full-size-kana; }
|
||||
</style>
|
||||
|
||||
<p>Test passes if both characters in each pair are the same shape <strong>and size</strong>.<br>
|
||||
Any missing glyph should be ignored
|
||||
as long as it is missing for both the first and second characters in a pair.
|
||||
|
||||
<div>
|
||||
<span><span class=test>･</span> ･</span>
|
||||
<span><span class=test>ｦ</span> ｦ</span>
|
||||
<span><span class=test>ｰ</span> ｰ</span>
|
||||
<span><span class=test>ｱ</span> ｱ</span>
|
||||
<span><span class=test>ｲ</span> ｲ</span>
|
||||
<span><span class=test>ｳ</span> ｳ</span>
|
||||
<span><span class=test>ｴ</span> ｴ</span>
|
||||
<span><span class=test>ｵ</span> ｵ</span>
|
||||
<span><span class=test>ｶ</span> ｶ</span>
|
||||
<span><span class=test>ｷ</span> ｷ</span>
|
||||
<span><span class=test>ｸ</span> ｸ</span>
|
||||
<span><span class=test>ｹ</span> ｹ</span>
|
||||
<span><span class=test>ｺ</span> ｺ</span>
|
||||
<span><span class=test>ｻ</span> ｻ</span>
|
||||
<span><span class=test>ｼ</span> ｼ</span>
|
||||
<span><span class=test>ｽ</span> ｽ</span>
|
||||
<span><span class=test>ｾ</span> ｾ</span>
|
||||
<span><span class=test>ｿ</span> ｿ</span>
|
||||
<span><span class=test>ﾀ</span> ﾀ</span>
|
||||
<span><span class=test>ﾁ</span> ﾁ</span>
|
||||
<span><span class=test>ﾂ</span> ﾂ</span>
|
||||
<span><span class=test>ﾃ</span> ﾃ</span>
|
||||
<span><span class=test>ﾄ</span> ﾄ</span>
|
||||
<span><span class=test>ﾅ</span> ﾅ</span>
|
||||
<span><span class=test>ﾆ</span> ﾆ</span>
|
||||
<span><span class=test>ﾇ</span> ﾇ</span>
|
||||
<span><span class=test>ﾈ</span> ﾈ</span>
|
||||
<span><span class=test>ﾉ</span> ﾉ</span>
|
||||
<span><span class=test>ﾊ</span> ﾊ</span>
|
||||
<span><span class=test>ﾋ</span> ﾋ</span>
|
||||
<span><span class=test>ﾌ</span> ﾌ</span>
|
||||
<span><span class=test>ﾍ</span> ﾍ</span>
|
||||
<span><span class=test>ﾎ</span> ﾎ</span>
|
||||
<span><span class=test>ﾏ</span> ﾏ</span>
|
||||
<span><span class=test>ﾐ</span> ﾐ</span>
|
||||
<span><span class=test>ﾑ</span> ﾑ</span>
|
||||
<span><span class=test>ﾒ</span> ﾒ</span>
|
||||
<span><span class=test>ﾓ</span> ﾓ</span>
|
||||
<span><span class=test>ﾔ</span> ﾔ</span>
|
||||
<span><span class=test>ﾕ</span> ﾕ</span>
|
||||
<span><span class=test>ﾖ</span> ﾖ</span>
|
||||
<span><span class=test>ﾗ</span> ﾗ</span>
|
||||
<span><span class=test>ﾘ</span> ﾘ</span>
|
||||
<span><span class=test>ﾙ</span> ﾙ</span>
|
||||
<span><span class=test>ﾚ</span> ﾚ</span>
|
||||
<span><span class=test>ﾛ</span> ﾛ</span>
|
||||
<span><span class=test>ﾜ</span> ﾜ</span>
|
||||
<span><span class=test>ﾝ</span> ﾝ</span>
|
||||
<span><span class=test>ﾞ</span> ﾞ</span>
|
||||
<span><span class=test>ﾟ</span> ﾟ</span>
|
||||
</div>
|
||||
|
|
@ -0,0 +1,23 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Text level 3 Test: text-transform:capitalize and text-shaping</title>
|
||||
<link rel="author" title="Florian Rivoal" href="https://florian.rivoal.net/">
|
||||
<link rel="help" href="https://www.w3.org/TR/css-text-3/#boundary-shaping">
|
||||
<link rel="help" href="https://www.w3.org/TR/css-text-3/#text-transform-property">
|
||||
<link rel="match" href="reference/text-transform-shaping-001-ref.html">
|
||||
<meta name="assert" content="Text shaping must not be broken across inline box boundaries when there is no change in formatting. Arabic is not a bicameral script, so text-transform:capitalize has no effect, and should not affect shaping.">
|
||||
<style>
|
||||
div { font-size: 4em; }
|
||||
div:last-of-type::first-letter { text-transform: capitalize; }
|
||||
body {
|
||||
/* Optional bit, just to avoid the arabic strings being too far off to the right,
|
||||
which makes them harder to notice if you're going through a lot of tests
|
||||
and not paying all that much attention. */
|
||||
max-width: 600px;
|
||||
max-width: max-content;
|
||||
}
|
||||
</style>
|
||||
|
||||
<p>Test passes if there are two identical strings below. Pay attention to the right-most character.
|
||||
<div dir=rtl lang=ar>عائلة</div>
|
||||
<div dir=rtl lang=ar>عائلة</div>
|
||||
|
|
@ -0,0 +1,23 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Text level 3 Test: text-transform:uppercase and text-shaping</title>
|
||||
<link rel="author" title="Florian Rivoal" href="https://florian.rivoal.net/">
|
||||
<link rel="help" href="https://www.w3.org/TR/css-text-3/#boundary-shaping">
|
||||
<link rel="help" href="https://www.w3.org/TR/css-text-3/#text-transform-property">
|
||||
<link rel="match" href="reference/text-transform-shaping-001-ref.html">
|
||||
<meta name="assert" content="Text shaping must not be broken across inline box boundaries when there is no change in formatting. Arabic is not a bicameral script, so text-transform:uppercase has no effect, and should not affect shaping.">
|
||||
<style>
|
||||
div { font-size: 4em; }
|
||||
div:last-of-type::first-letter { text-transform: uppercase; }
|
||||
body {
|
||||
/* Optional bit, just to avoid the arabic strings being too far off to the right,
|
||||
which makes them harder to notice if you're going through a lot of tests
|
||||
and not paying all that much attention. */
|
||||
max-width: 600px;
|
||||
max-width: max-content;
|
||||
}
|
||||
</style>
|
||||
|
||||
<p>Test passes if there are two identical strings below. Pay attention to the right-most character.
|
||||
<div dir=rtl lang=ar>عائلة</div>
|
||||
<div dir=rtl lang=ar>عائلة</div>
|
||||
|
|
@ -0,0 +1,23 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Text level 3 Test: text-transform:lowercase and text-shaping</title>
|
||||
<link rel="author" title="Florian Rivoal" href="https://florian.rivoal.net/">
|
||||
<link rel="help" href="https://www.w3.org/TR/css-text-3/#boundary-shaping">
|
||||
<link rel="help" href="https://www.w3.org/TR/css-text-3/#text-transform-property">
|
||||
<link rel="match" href="reference/text-transform-shaping-001-ref.html">
|
||||
<meta name="assert" content="Text shaping must not be broken across inline box boundaries when there is no change in formatting. Arabic is not a bicameral script, so text-transform:lowercase has no effect, and should not affect shaping.">
|
||||
<style>
|
||||
div { font-size: 4em; }
|
||||
div:last-of-type::first-letter { text-transform: lowercase; }
|
||||
body {
|
||||
/* Optional bit, just to avoid the arabic strings being too far off to the right,
|
||||
which makes them harder to notice if you're going through a lot of tests
|
||||
and not paying all that much attention. */
|
||||
max-width: 600px;
|
||||
max-width: max-content;
|
||||
}
|
||||
</style>
|
||||
|
||||
<p>Test passes if there are two identical strings below. Pay attention to the right-most character.
|
||||
<div dir=rtl lang=ar>عائلة</div>
|
||||
<div dir=rtl lang=ar>عائلة</div>
|
||||
|
|
@ -3,8 +3,8 @@
|
|||
<title>CSS Text level 3 Test: preserved white space at the end of and white-space:pre-wrap with right alignement</title>
|
||||
<link rel="author" title="Florian Rivoal" href="http://florian.rivoal.net/">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-text-3/#white-space-phase-2">
|
||||
<link rel="match" href="reference/pre-wrap-001-ref.html">
|
||||
<meta name="assert" content="When white-space is pre-wrap, only spaces that overflow the line get collapsed or hanged, the ones that fit have an effect when right-aligning.">
|
||||
<link rel="match" href="reference/pre-wrap-012-ref.html">
|
||||
<meta name="assert" content="When white-space is pre-wrap, spaces at the end of the line hang, so they do not have any effect when right-aligning.">
|
||||
<style>
|
||||
div {
|
||||
font-size: 20px;
|
||||
|
|
@ -13,7 +13,7 @@ div {
|
|||
white-space: pre-wrap;
|
||||
color: green;
|
||||
|
||||
background: linear-gradient(red, red) 0 0/2ch 2ch no-repeat;
|
||||
background: linear-gradient(red, red) 1ch 0/2ch 2ch no-repeat;
|
||||
|
||||
width: 3ch;
|
||||
text-align: right;
|
||||
|
|
|
|||
|
|
@ -3,8 +3,8 @@
|
|||
<title>CSS Text level 3 Test: preserved white space at the end of and white-space:pre-wrap with center alignement</title>
|
||||
<link rel="author" title="Florian Rivoal" href="http://florian.rivoal.net/">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-text-3/#white-space-phase-2">
|
||||
<link rel="match" href="reference/pre-wrap-001-ref.html">
|
||||
<meta name="assert" content="When white-space is pre-wrap, only spaces that overflow the line get collapsed or hanged, the ones that fit have an effect when centering.">
|
||||
<link rel="match" href="reference/pre-wrap-013-ref.html">
|
||||
<meta name="assert" content="When white-space is pre-wrap, spaces at the end of the line hang, so they do not have any effect when centering.">
|
||||
<style>
|
||||
div {
|
||||
font-size: 20px;
|
||||
|
|
@ -13,7 +13,7 @@ div {
|
|||
white-space: pre-wrap;
|
||||
color: green;
|
||||
|
||||
background: linear-gradient(red, red) 0 0/2ch 2ch no-repeat;
|
||||
background: linear-gradient(red, red) 0.5ch 0/2ch 2ch no-repeat;
|
||||
|
||||
width: 3ch;
|
||||
text-align: center;
|
||||
|
|
|
|||
|
|
@ -3,25 +3,29 @@
|
|||
<title>CSS Text level 3 Test: preserved white space at the end of and white-space:pre-wrap with justification</title>
|
||||
<link rel="author" title="Florian Rivoal" href="http://florian.rivoal.net/">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-text-3/#white-space-phase-2">
|
||||
<link rel="match" href="reference/pre-wrap-001-ref.html">
|
||||
<meta name="assert" content="When white-space is pre-wrap, only spaces that overflow the line get collapsed or hanged, the ones that fit have an effect when justifying.">
|
||||
<link rel="match" href="reference/pre-wrap-014-ref.html">
|
||||
<meta name="assert" content="When white-space is pre-wrap, spaces at the end of the line hang, so they do not have any effect when justifying.">
|
||||
<style>
|
||||
div {
|
||||
font-size: 20px;
|
||||
font-family: Ahem;
|
||||
line-height: 1em;
|
||||
height: 1em;
|
||||
white-space: pre-wrap;
|
||||
color: green;
|
||||
|
||||
background: linear-gradient(red, red) 0 0/2ch 2ch no-repeat;
|
||||
color: transparent;
|
||||
background: red;
|
||||
|
||||
width: 3ch;
|
||||
width: 4ch;
|
||||
text-align: justify;
|
||||
text-justify: inter-character;
|
||||
}
|
||||
span {
|
||||
color: green;
|
||||
background: green;
|
||||
}
|
||||
</style>
|
||||
<body>
|
||||
<p>Test passes if there is a <strong>filled green square</strong> and <strong>no red</strong>.</p>
|
||||
<div>X​X 
|
||||
X​X </div>
|
||||
<p>Test passes if there is a <strong>filled green rectangle</strong> and <strong>no red</strong>.</p>
|
||||
<div><span>X X</span> 
|
||||
X</div><!-- invisible last line, because justification works on non-last lines-->
|
||||
</body>
|
||||
|
|
|
|||
|
|
@ -0,0 +1,20 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Text level 3 Test reference</title>
|
||||
<link rel="author" title="Florian Rivoal" href="http://florian.rivoal.net/">
|
||||
<style>
|
||||
div {
|
||||
font-size: 20px;
|
||||
font-family: Ahem;
|
||||
line-height: 1em;
|
||||
color: green;
|
||||
|
||||
width: 2ch;
|
||||
margin-left: 1ch;
|
||||
}
|
||||
</style>
|
||||
<body>
|
||||
<p>Test passes if there is a <strong>filled green square</strong> and <strong>no red</strong>.</p>
|
||||
<div>XX
|
||||
XX</div>
|
||||
</body>
|
||||
|
|
@ -0,0 +1,20 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Text level 3 Test reference</title>
|
||||
<link rel="author" title="Florian Rivoal" href="http://florian.rivoal.net/">
|
||||
<style>
|
||||
div {
|
||||
font-size: 20px;
|
||||
font-family: Ahem;
|
||||
line-height: 1em;
|
||||
color: green;
|
||||
|
||||
width: 2ch;
|
||||
margin-left: 0.5ch;
|
||||
}
|
||||
</style>
|
||||
<body>
|
||||
<p>Test passes if there is a <strong>filled green square</strong> and <strong>no red</strong>.</p>
|
||||
<div>XX
|
||||
XX</div>
|
||||
</body>
|
||||
|
|
@ -0,0 +1,17 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Text level 3 Test reference</title>
|
||||
<link rel="author" title="Florian Rivoal" href="http://florian.rivoal.net/">
|
||||
<style>
|
||||
div {
|
||||
font-size: 20px;
|
||||
font-family: Ahem;
|
||||
line-height: 1em;
|
||||
color: green;
|
||||
|
||||
}
|
||||
</style>
|
||||
<body>
|
||||
<p>Test passes if there is a <strong>filled green rectangle</strong> and <strong>no red</strong>.</p>
|
||||
<div>XXXX</div>
|
||||
</body>
|
||||
|
|
@ -0,0 +1,15 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>test reference</title>
|
||||
<link rel="author" title="Florian Rivoal" href="https://florian.rivoal.net/">
|
||||
<style>
|
||||
div {
|
||||
font-family: monospace;
|
||||
color: transparent;
|
||||
font-size: 50px;
|
||||
background: green;
|
||||
}
|
||||
</style>
|
||||
|
||||
<p>Test passes if there is a green rectangle below and no red.
|
||||
<div>XS<br>S<br>XS<br>S</div>
|
||||
|
|
@ -0,0 +1,19 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>test reference</title>
|
||||
<link rel="author" title="Florian Rivoal" href="https://florian.rivoal.net/">
|
||||
<style>
|
||||
div {
|
||||
color: transparent;
|
||||
background: blue;
|
||||
font-family: monospace;
|
||||
font-size: 50px;
|
||||
width: 3ch;
|
||||
}
|
||||
</style>
|
||||
|
||||
<p>Test passes if there is a single blue rectangle below.
|
||||
<div>
|
||||
XXX<br>
|
||||
XXX
|
||||
</div>
|
||||
|
|
@ -0,0 +1,14 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>test reference</title>
|
||||
<link rel="author" title="Florian Rivoal" href="https://florian.rivoal.net/">
|
||||
<style>
|
||||
div {
|
||||
color: transparent;
|
||||
font-size: 50px;
|
||||
background: green;
|
||||
}
|
||||
</style>
|
||||
|
||||
<p>Test passes if there is a green rectangle below and no red.
|
||||
<div>X<br>X</div>
|
||||
|
|
@ -0,0 +1,22 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>test reference</title>
|
||||
<link rel="author" title="Florian Rivoal" href="https://florian.rivoal.net/">
|
||||
<style>
|
||||
aside {
|
||||
float: left;
|
||||
background: blue;
|
||||
}
|
||||
div {
|
||||
color: transparent;
|
||||
font-family: monospace;
|
||||
font-size: 50px;
|
||||
width: 5ch;
|
||||
}
|
||||
</style>
|
||||
|
||||
<p>Test passes if there is a single blue rectangle below.
|
||||
<div>
|
||||
<aside class=own>X</aside>
|
||||
<aside class=owbw>X</aside>
|
||||
</div>
|
||||
|
|
@ -0,0 +1,25 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Text level 3 Test: the nearest tab stop is more than 0.5 ch away, white-space:pre-wrap</title>
|
||||
<link rel="author" title="Florian Rivoal" href="https://florian.rivoal.net/">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-text-3/#white-space-phase-2">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-text-3/#tab-size-property">
|
||||
<link rel="match" href="reference/tab-stop-threshold-001-ref.html">
|
||||
<meta name="assert" content="A preserved tab pushes to the nearest tap stop as long as we're not closer to it than 0.5ch, under white-space:pre-wrap">
|
||||
<style>
|
||||
div {
|
||||
white-space: pre-wrap;
|
||||
font-family: monospace;
|
||||
tab-size: 8; /* the initial value, but since we're measuring against it, we might as well be sure */
|
||||
}
|
||||
span { display: inline-block; }
|
||||
#s1 { width: 6ch; }
|
||||
#s2 { width: 7ch; }
|
||||
#s3 { width: 7.3ch; }
|
||||
</style>
|
||||
|
||||
<p>Test passes if the 4 letters bellow are vertically aligned.
|
||||
<div><span id=s1></span>	P</div>
|
||||
<div><span id=s2></span>	A</div>
|
||||
<div><span id=s3></span>	S</div>
|
||||
<div> S</div>
|
||||
|
|
@ -0,0 +1,25 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Text level 3 Test: the nearest tab stop is less than 0.5 ch away, white-space:pre-wrap</title>
|
||||
<link rel="author" title="Florian Rivoal" href="http://florian.rivoal.net/">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-text-3/#white-space-phase-2">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-text-3/#tab-size-property">
|
||||
<link rel="match" href="reference/tab-stop-threshold-002-ref.html">
|
||||
<meta name="assert" content="A preserved tab pushes to the tab stop after the nearest one as long as we're closer to the nearest one than 0.5ch, under white-space:pre-wrap.">
|
||||
<style>
|
||||
div {
|
||||
white-space: pre-wrap;
|
||||
font-family: monospace;
|
||||
tab-size: 8; /* the initial value, but since we're measuring against it, we might as well be sure */
|
||||
}
|
||||
span { display: inline-block; }
|
||||
#s1 { width: 7.6ch; }
|
||||
#s2 { width: 7.8ch; }
|
||||
#s3 { width: 7.9ch; }
|
||||
</style>
|
||||
|
||||
<p>Test passes if the 4 letters bellow are vertically aligned.
|
||||
<div><span id=s1></span>	P</div>
|
||||
<div><span id=s2></span>	A</div>
|
||||
<div><span id=s3></span>	S</div>
|
||||
<div> S</div>
|
||||
|
|
@ -0,0 +1,25 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Text level 3 Test: the nearest tab stop is more than 0.5 ch away, white-space:break-spaces</title>
|
||||
<link rel="author" title="Florian Rivoal" href="https://florian.rivoal.net/">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-text-3/#white-space-phase-2">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-text-3/#tab-size-property">
|
||||
<link rel="match" href="reference/tab-stop-threshold-001-ref.html">
|
||||
<meta name="assert" content="A preserved tab pushes to the nearest tap stop as long as we're not closer to it than 0.5ch, under white-space:break-spaces">
|
||||
<style>
|
||||
div {
|
||||
white-space: break-spaces;
|
||||
font-family: monospace;
|
||||
tab-size: 8; /* the initial value, but since we're measuring against it, we might as well be sure */
|
||||
}
|
||||
span { display: inline-block; }
|
||||
#s1 { width: 6ch; }
|
||||
#s2 { width: 7ch; }
|
||||
#s3 { width: 7.3ch; }
|
||||
</style>
|
||||
|
||||
<p>Test passes if the 4 letters bellow are vertically aligned.
|
||||
<div><span id=s1></span>	P</div>
|
||||
<div><span id=s2></span>	A</div>
|
||||
<div><span id=s3></span>	S</div>
|
||||
<div> S</div>
|
||||
|
|
@ -0,0 +1,25 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Text level 3 Test: the nearest tab stop is less than 0.5 ch away, white-space:break-spaces</title>
|
||||
<link rel="author" title="Florian Rivoal" href="http://florian.rivoal.net/">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-text-3/#white-space-phase-2">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-text-3/#tab-size-property">
|
||||
<link rel="match" href="reference/tab-stop-threshold-002-ref.html">
|
||||
<meta name="assert" content="A preserved tab pushes to the tab stop after the nearest one as long as we're closer to the nearest one than 0.5ch, under white-space:break-spaces.">
|
||||
<style>
|
||||
div {
|
||||
white-space: break-spaces;
|
||||
font-family: monospace;
|
||||
tab-size: 8; /* the initial value, but since we're measuring against it, we might as well be sure */
|
||||
}
|
||||
span { display: inline-block; }
|
||||
#s1 { width: 7.6ch; }
|
||||
#s2 { width: 7.8ch; }
|
||||
#s3 { width: 7.9ch; }
|
||||
</style>
|
||||
|
||||
<p>Test passes if the 4 letters bellow are vertically aligned.
|
||||
<div><span id=s1></span>	P</div>
|
||||
<div><span id=s2></span>	A</div>
|
||||
<div><span id=s3></span>	S</div>
|
||||
<div> S</div>
|
||||
|
|
@ -0,0 +1,46 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Text Test: min-content sizing and white-space: break-spaces</title>
|
||||
<link rel="author" title="Florian Rivoal" href="https://florian.rivoal.net/">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-text-3/#propdef-white-space">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-text-3/#white-space-phase-2">
|
||||
<meta name="flags" content="">
|
||||
<link rel="match" href="reference/white-space-intrinsic-size-001-ref.html">
|
||||
<meta name="assert" content="When white-space is break-spaces, preserved spaces at the end of the line do affect the intrinsic min-content size. Overflow-wrap makes no difference.">
|
||||
<style>
|
||||
aside {
|
||||
float: left;
|
||||
white-space: break-spaces;
|
||||
background: green;
|
||||
}
|
||||
aside:last-of-type { overflow-wrap: break-word; }
|
||||
div {
|
||||
font-family: monospace;
|
||||
color: transparent;
|
||||
font-size: 50px;
|
||||
width: 0ch;
|
||||
}
|
||||
|
||||
#red {
|
||||
position: absolute;
|
||||
background: red;
|
||||
width: auto;
|
||||
z-index: -1;
|
||||
}
|
||||
</style>
|
||||
|
||||
<p>Test passes if there is a green rectangle below and no red.
|
||||
<div id=red>XS<br>S<br>XS<br>S</div>
|
||||
<div>
|
||||
<aside>X </aside>
|
||||
<aside>X </aside>
|
||||
</div>
|
||||
<!-- Note: the space immediately following the X does not get wrapped,
|
||||
even under break-spaces+break-word:
|
||||
The parent of the flow is 0-width,
|
||||
so the float is min-content sized,
|
||||
which should leave enough room for both the X and one space.
|
||||
break-space+break-word would allow for an emergency wrap before the space
|
||||
if the float itself was sized too small,
|
||||
but it isn't.
|
||||
-->
|
||||
|
|
@ -0,0 +1,39 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Text Test: max-content sizing and white-space:break-spaces</title>
|
||||
<link rel="author" title="Florian Rivoal" href="https://florian.rivoal.net/">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-text-3/#propdef-white-space">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-text-3/#white-space-phase-2">
|
||||
<meta name="flags" content="">
|
||||
<link rel="match" href="reference/white-space-intrinsic-size-002-ref.html">
|
||||
<meta name="assert" content="If white-space is break-spaces, preserved spaces at the end of the line do affect the intrinsic max-content size. The value of overflow-wrap makes no difference.">
|
||||
<style>
|
||||
aside {
|
||||
float: left;
|
||||
white-space: break-spaces;
|
||||
background: blue;
|
||||
}
|
||||
aside:last-of-type {
|
||||
float:right;
|
||||
overflow-wrap: break-word;
|
||||
}
|
||||
div {
|
||||
color: transparent;
|
||||
font-family: monospace;
|
||||
font-size: 50px;
|
||||
width: 3ch;
|
||||
/* both floats should take the full 3ch,
|
||||
one on each line
|
||||
and therefore line up to look like a single large box.
|
||||
|
||||
If the spaces are not taken into account for min-content sizing,
|
||||
the floats will leave a gap between them */
|
||||
}
|
||||
.owbw { overflow-wrap: break-word; }
|
||||
</style>
|
||||
|
||||
<p>Test passes if there is a single blue rectangle below.
|
||||
<div>
|
||||
<aside>X </aside>
|
||||
<aside>X </aside>
|
||||
</div>
|
||||
|
|
@ -0,0 +1,38 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Text Test: min-content sizing and white-space:pre-wrap</title>
|
||||
<link rel="author" title="Florian Rivoal" href="https://florian.rivoal.net/">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-text-3/#propdef-white-space">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-text-3/#white-space-phase-2">
|
||||
<meta name="flags" content="">
|
||||
<link rel="match" href="reference/white-space-intrinsic-size-003-ref.html">
|
||||
<meta name="assert" content="Preserved spaces at the end of the line do not affect the intrinsic min-content size when white-space is pre-wrap. The value of overflow-wrap makes no difference.">
|
||||
<style>
|
||||
aside {
|
||||
float: left;
|
||||
white-space: pre-wrap;
|
||||
background: red;
|
||||
}
|
||||
div {
|
||||
color: transparent;
|
||||
font-size: 50px;
|
||||
width: 0ch;
|
||||
}
|
||||
.own { overflow-wrap: normal; }
|
||||
.owbw{ overflow-wrap: break-word; }
|
||||
|
||||
#green {
|
||||
position: absolute;
|
||||
background: green;
|
||||
z-index: 1;
|
||||
width: auto;
|
||||
}
|
||||
</style>
|
||||
|
||||
<p>Test passes if there is a green rectangle below and no red.
|
||||
<div id=green>X<br>X</div>
|
||||
<div>
|
||||
<aside class=own>X </aside>
|
||||
<aside class=owbw>X </aside>
|
||||
</div>
|
||||
|
||||
|
|
@ -0,0 +1,31 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Text Test: max-content sizing and white-space: pre-wrap</title>
|
||||
<link rel="author" title="Florian Rivoal" href="https://florian.rivoal.net/">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-text-3/#propdef-white-space">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-text-3/#white-space-phase-2">
|
||||
<meta name="flags" content="">
|
||||
<link rel="match" href="reference/white-space-intrinsic-size-004-ref.html">
|
||||
<meta name="assert" content="Preserved spaces at the end of the line do not affect the intrinsic max-content size when white-space is pre-wrap. The value of overflow-wrap makes no difference.">
|
||||
<style>
|
||||
aside {
|
||||
float: left;
|
||||
white-space: pre-wrap;
|
||||
background: blue;
|
||||
margin-bottom: 1em;
|
||||
}
|
||||
aside:last-of-type { overflow-wrap: break-word; }
|
||||
div {
|
||||
color: transparent;
|
||||
font-family: monospace;
|
||||
font-size: 50px;
|
||||
width: 3ch; /* enough room for both floats if their max-content size does not include the preserved spaces,
|
||||
but not enough if they do, causing a line break in that case. */
|
||||
}
|
||||
</style>
|
||||
|
||||
<p>Test passes if there is a single blue rectangle below.
|
||||
<div>
|
||||
<aside>X </aside>
|
||||
<aside>X </aside>
|
||||
</div>
|
||||
Loading…
Add table
Add a link
Reference in a new issue