forked from web-platform-tests/wpt
-
Notifications
You must be signed in to change notification settings - Fork 3
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
layout: Make all word separators justification opportunities
This change adapts both layout and legacy layout to the specification which gives a list of word separators to use as justification opportunities.
- Loading branch information
1 parent
83067a9
commit 2d9cd5b
Showing
2 changed files
with
75 additions
and
0 deletions.
There are no files selected for viewing
28 changes: 28 additions & 0 deletions
28
css/css-text/text-justify/text-justify-word-separators-ref.html
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,28 @@ | ||
<!DOCTYPE html> | ||
<html> | ||
<head> | ||
<meta charset="utf-8"> | ||
<link rel="author" title="Martin Robinson" href="mailto:mrobinson@igalia.com"> | ||
<link rel="help" href="https://drafts.csswg.org/css-text/#word-separator"> | ||
<meta name="assert" content="text-justify:inter-word should adjust spacing at all word separators."> | ||
<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" /> | ||
<style> | ||
.justified { | ||
font: 10px/1 Ahem; | ||
text-align: justify; | ||
text-justify: inter-word; | ||
width: 120px; | ||
border: solid 1px black; | ||
} | ||
</style> | ||
</head> | ||
<body> | ||
<div class="justified">XXXX XXXX XXXX</div> | ||
<div class="justified">XXXX XXXX XXXX</div> | ||
<div class="justified">XXXX XXXX XXXX</div> | ||
<div class="justified">XXXX XXXX XXXX</div> | ||
<div class="justified">XXXX XXXX XXXX</div> | ||
<div class="justified">XXXX XXXX XXXX</div> | ||
<div class="justified">XXXX XXXX XXXX</div> | ||
</body> | ||
</html> |
47 changes: 47 additions & 0 deletions
47
css/css-text/text-justify/text-justify-word-separators.html
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,47 @@ | ||
<!DOCTYPE html> | ||
<html> | ||
<head> | ||
<meta charset="utf-8"> | ||
<title>CSS Text 6.4. Justification Method: text-justify: inter-word</title> | ||
<link rel="author" title="Martin Robinson" href="mailto:mrobinson@igalia.com"> | ||
<link rel="help" href="https://drafts.csswg.org/css-text/#word-separator"> | ||
<link rel='match' href='text-justify-word-separators-ref.html'> | ||
<meta name="assert" content="text-justify:inter-word should adjust spacing at all word separators."> | ||
<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" /> | ||
<style> | ||
.justified { | ||
font: 10px/1 Ahem; | ||
text-align: justify; | ||
text-justify: inter-word; | ||
width: 120px; | ||
border: solid 1px black; | ||
} | ||
/* Hide the word separators, in case the system doesn't | ||
have an appropriate font installed and shows tofu. | ||
Justification should still work in this case. */ | ||
.hidden { | ||
color: transparent; | ||
} | ||
</style> | ||
</head> | ||
<body> | ||
<!-- A normal space --> | ||
<div class="justified">XXXX XXXX XXXX</div> | ||
|
||
<!-- Non-breaking space --> | ||
<div class="justified">XXXX<span class="hidden"> </span>XXXX XXXX</div> | ||
|
||
<!-- Ethiopic word space --> | ||
<div class="justified">XXXX<span class="hidden">፡</span>XXXX XXXX</div> | ||
|
||
<!-- Aegean word separators --> | ||
<div class="justified">XXXX<span class="hidden">𐄀</span>XXXX XXXX</div> | ||
<div class="justified">XXXX<span class="hidden">𐄁</span>XXXX XXXX</div> | ||
|
||
<!-- Ugaritic word divider --> | ||
<div class="justified">XXXX<span class="hidden">𐎟</span>XXXX XXXX</div> | ||
|
||
<!-- Phoenician word separator --> | ||
<div class="justified">XXXX<span class="hidden">𐤟</span>XXXX XXXX</div> | ||
</body> | ||
</html> |