[css-text-3] White space pre wrap end of line #5283
There are no files selected for viewing
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,24 @@ | ||
| <!DOCTYPE html> | ||
| <meta charset="utf-8"> | ||
| <title>CSS Text level 3 Test: preserved white space at the end of and white-space:pre-wrap is not wrapped</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="preserved white space at the end of the line is not wrapped when the white-space property is set to pre-wrap"> | ||
| <style> | ||
| div { | ||
| font-size: 20px; | ||
| font-family: ahem; | ||
| line-height: 1em; | ||
| white-space: pre-wrap; | ||
| color: green; | ||
|
|
||
| background: linear-gradient(red, red) 0 0/2ch 2ch no-repeat; | ||
|
|
||
| width: 4ch; | ||
| } | ||
| </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> |
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,25 @@ | ||
| <!DOCTYPE html> | ||
| <meta charset="utf-8"> | ||
| <title>CSS Text level 3 Test: preserved white space at the end of and white-space:pre-wrap does not change based on word-break:break-all</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="preserved white space at the end of the line is not wrapped when the white-space property is set to pre-wrap, even if word-break is break-all"> | ||
| <style> | ||
| div { | ||
| font-size: 20px; | ||
| font-family: ahem; | ||
| line-height: 1em; | ||
| white-space: pre-wrap; | ||
| color: green; | ||
|
|
||
| background: linear-gradient(red, red) 0 0/2ch 2ch no-repeat; | ||
|
|
||
| width: 4ch; | ||
| word-break: break-all; | ||
| } | ||
| </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> |
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,25 @@ | ||
| <!DOCTYPE html> | ||
| <meta charset="utf-8"> | ||
| <title>CSS Text level 3 Test: preserved white space at the end of and white-space:pre-wrap does not change based on word-break:keep-all</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="preserved white space at the end of the line is not wrapped when the white-space property is set to pre-wrap, even if word-break is keep-all."> | ||
| <style> | ||
| div { | ||
| font-size: 20px; | ||
| font-family: ahem; | ||
| line-height: 1em; | ||
| white-space: pre-wrap; | ||
| color: green; | ||
|
|
||
| background: linear-gradient(red, red) 0 0/2ch 2ch no-repeat; | ||
|
|
||
| width: 4ch; | ||
| word-break: keep-all; | ||
| } | ||
| </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> |
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,25 @@ | ||
| <!DOCTYPE html> | ||
| <meta charset="utf-8"> | ||
| <title>CSS Text level 3 Test: preserved white space at the end of and white-space:pre-wrap does not change based on line-break:loose</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="preserved white space at the end of the line is not wrapped when the white-space property is set to pre-wrap, even if line-break is loose."> | ||
| <style> | ||
| div { | ||
| font-size: 20px; | ||
| font-family: ahem; | ||
| line-height: 1em; | ||
| white-space: pre-wrap; | ||
| color: green; | ||
|
|
||
| background: linear-gradient(red, red) 0 0/2ch 2ch no-repeat; | ||
|
|
||
| width: 4ch; | ||
| line-break: loose; | ||
| } | ||
| </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> |
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,25 @@ | ||
| <!DOCTYPE html> | ||
| <meta charset="utf-8"> | ||
| <title>CSS Text level 3 Test: preserved white space at the end of and white-space:pre-wrap does not change based on line-break:normal</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="preserved white space at the end of the line is not wrapped when the white-space property is set to pre-wrap, even if line-break is normal."> | ||
| <style> | ||
| div { | ||
| font-size: 20px; | ||
| font-family: ahem; | ||
| line-height: 1em; | ||
| white-space: pre-wrap; | ||
| color: green; | ||
|
|
||
| background: linear-gradient(red, red) 0 0/2ch 2ch no-repeat; | ||
|
|
||
| width: 4ch; | ||
| line-break: normal; | ||
| } | ||
| </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> |
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,25 @@ | ||
| <!DOCTYPE html> | ||
| <meta charset="utf-8"> | ||
| <title>CSS Text level 3 Test: preserved white space at the end of and white-space:pre-wrap does not change based on line-break:strict</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="preserved white space at the end of the line is not wrapped when the white-space property is set to pre-wrap, even if line-break is strict."> | ||
| <style> | ||
| div { | ||
| font-size: 20px; | ||
| font-family: ahem; | ||
| line-height: 1em; | ||
| white-space: pre-wrap; | ||
| color: green; | ||
|
|
||
| background: linear-gradient(red, red) 0 0/2ch 2ch no-repeat; | ||
|
|
||
| width: 4ch; | ||
| line-break: strict; | ||
| } | ||
| </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> |
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,26 @@ | ||
| <!DOCTYPE html> | ||
| <meta charset="utf-8"> | ||
| <title>CSS Text level 3 Test: preserved white space at the end of and white-space:pre-wrap does not change based on overflow-wrap:break-word</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="preserved white space at the end of the line is not wrapped when the white-space property is set to pre-wrap, even if overflow-wrap is break-word."> | ||
| <style> | ||
| div { | ||
| font-size: 20px; | ||
| font-family: ahem; | ||
| line-height: 1em; | ||
| white-space: pre-wrap; | ||
| color: green; | ||
|
|
||
| background: linear-gradient(red, red) 0 0/2ch 2ch no-repeat; | ||
|
|
||
| width: 4ch; | ||
| word-wrap: break-word; /* deprecated alias */ | ||
| overflow-wrap: break-word; | ||
| } | ||
| </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> |
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,27 @@ | ||
| <!DOCTYPE html> | ||
| <meta charset="utf-8"> | ||
| <title>CSS Text level 3 Test: preserved white space at the end of and white-space:pre-wrap is wrapped when overflow-wrap is 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/#valdef-overflow-wrap-break-spaces"> | ||
| <link rel="match" href="reference/pre-wrap-001-ref.html"> | ||
| <meta name="assert" content="preserved white space at the end of the line is wrapped when the white-space property is set to pre-wrap and overflow-wrap is break-spaces."> | ||
| <style> | ||
| div { | ||
| font-size: 20px; | ||
| font-family: ahem; | ||
| line-height: 1em; | ||
| white-space: pre-wrap; | ||
| color: green; | ||
|
|
||
| background: linear-gradient(red, red) 1ch 0/2ch 2ch no-repeat; | ||
|
|
||
| width: 4ch; | ||
| overflow-wrap: break-spaces; | ||
| 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> |
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,27 @@ | ||
| <!DOCTYPE html> | ||
| <meta charset="utf-8"> | ||
| <title>CSS Text level 3 Test: single preserved white space at the end of with white-space:pre-wrap overflow-wrap: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/#valdef-overflow-wrap-break-spaces"> | ||
| <link rel="match" href="reference/pre-wrap-001-ref.html"> | ||
| <meta name="assert" content="a single preserved white space at the end of the line is not wrapped when the white-space property is set to pre-wrap and overflow-wrap is break-spaces."> | ||
| <style> | ||
| div { | ||
| font-size: 20px; | ||
| font-family: ahem; | ||
| line-height: 1em; | ||
| white-space: pre-wrap; | ||
| color: green; | ||
|
|
||
| background: linear-gradient(red, red) 0 0/2ch 2ch no-repeat; | ||
|
|
||
| width: 2ch; | ||
| overflow-wrap: break-spaces; | ||
| } | ||
|
|
||
| </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> |
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,27 @@ | ||
| <!DOCTYPE html> | ||
| <meta charset="utf-8"> | ||
| <title>CSS Text level 3 Test: single preserved white space at the end of with white-space:pre-wrap overflow-wrap:break-spaces break-word</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/#overflow-wrap-property"> | ||
| <link rel="match" href="reference/pre-wrap-001-ref.html"> | ||
| <meta name="assert" content="a single preserved white space at the end of the line is wrapped when the white-space property is set to pre-wrap and overflow-wrap is break-spaces break-word."> | ||
| <style> | ||
| div { | ||
| font-size: 20px; | ||
| font-family: ahem; | ||
| line-height: 1em; | ||
| white-space: pre-wrap; | ||
| color: green; | ||
|
|
||
| background: linear-gradient(red, red) 1ch 0/2ch 2ch no-repeat; | ||
|
|
||
| width: 3ch; | ||
| overflow-wrap: break-spaces break-word; | ||
| 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> |
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,27 @@ | ||
| <!DOCTYPE html> | ||
| <meta charset="utf-8"> | ||
| <title>CSS Text level 3 Test: preserved white space at the end of and white-space:pre-wrap does not cause wrapping</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/#overflow-wrap-property"> | ||
| <link rel="match" href="reference/pre-wrap-001-ref.html"> | ||
| <meta name="assert" content="When the hite-space property is set to pre-wrap, preserved white space at the end of the line must hang or be collapsed, and must not cause preceeding content to be wrapped."> | ||
|
There was a problem hiding this comment. where in the spec is that defined? There was a problem hiding this comment. In https://drafts.csswg.org/css-text-3/#white-space-phase-2 subpoint 4 |
||
| <style> | ||
| div { | ||
| font-size: 20px; | ||
| font-family: ahem; | ||
| line-height: 1em; | ||
| white-space: pre-wrap; | ||
| color: green; | ||
|
|
||
| background: linear-gradient(red, red) 1ch 0/2ch 2ch no-repeat; | ||
|
|
||
| width: 3ch; | ||
| 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> | ||
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,26 @@ | ||
| <!DOCTYPE html> | ||
| <meta charset="utf-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."> | ||
| <style> | ||
| div { | ||
| font-size: 20px; | ||
| font-family: ahem; | ||
| line-height: 1em; | ||
| white-space: pre-wrap; | ||
| color: green; | ||
|
|
||
| background: linear-gradient(red, red) 0 0/2ch 2ch no-repeat; | ||
|
|
||
| width: 3ch; | ||
| text-align: right; | ||
| } | ||
| </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> |
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,26 @@ | ||
| <!DOCTYPE html> | ||
| <meta charset="utf-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."> | ||
| <style> | ||
| div { | ||
| font-size: 20px; | ||
| font-family: ahem; | ||
| line-height: 1em; | ||
| white-space: pre-wrap; | ||
| color: green; | ||
|
|
||
| background: linear-gradient(red, red) 0 0/2ch 2ch no-repeat; | ||
|
|
||
| width: 3ch; | ||
| text-align: center; | ||
| } | ||
| </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> |
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,27 @@ | ||
| <!DOCTYPE html> | ||
| <meta charset="utf-8"> | ||
| <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."> | ||
| <style> | ||
| div { | ||
| font-size: 20px; | ||
| font-family: ahem; | ||
| line-height: 1em; | ||
| white-space: pre-wrap; | ||
| color: green; | ||
|
|
||
| background: linear-gradient(red, red) 0 0/2ch 2ch no-repeat; | ||
|
|
||
| width: 3ch; | ||
| text-align: justify; | ||
| text-justify: inter-character; | ||
| } | ||
| </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> | ||
| </body> |
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,16 @@ | ||
| <!DOCTYPE html> | ||
| <meta charset="utf-8"> | ||
| <title>CSS Text level 3 Test reference file</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 square</strong> and <strong>no red</strong>.</p> | ||
| <div>XX<br>XX</div> | ||
| </body> |
Oops, something went wrong.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
s/hite-space/white-space