[css-text-3] Tests for percentage text indent #11373
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,11 @@ | ||
| <!DOCTYPE html> | ||
| <html lang=en> | ||
| <meta charset="utf-8"> | ||
| <title>CSS Text Test reference</title> | ||
| <link rel="author" title="Florian Rivoal" href="http://florian.rivoal.net/"> | ||
| <style> | ||
| div { padding-left: 50px; } | ||
| </style> | ||
|
|
||
| <p>Test passes if there is a single black X below and no red. | ||
| <div>X</div> |
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> | ||
| <html lang=en> | ||
| <meta charset="utf-8"> | ||
| <title>CSS Text Test: text-indent percentage resolution basis</title> | ||
| <link rel="author" title="Florian Rivoal" href="http://florian.rivoal.net/"> | ||
| <link rel="help" href="https://drafts.csswg.org/css-text-3/#text-indent-property"> | ||
| <meta name="flags" content=""> | ||
| <link rel="match" href="reference/text-indent-percentage-002-ref.html"> | ||
| <meta name="assert" content="Percentages in text-indent refer to width of the element's content box"> | ||
| <style> | ||
| section { position: absolute; } | ||
| section, div { | ||
| border-right: 10px solid white; | ||
| margin-right: 10px; | ||
| padding-right: 10px; | ||
| } | ||
| div { | ||
| box-sizing: border-box; | ||
| width: 120px; | ||
| } | ||
| .test div { text-indent: 50%; color: red; } | ||
| .ref div { text-indent: 50px; } | ||
| </style> | ||
|
|
||
| <p>Test passes if there is a single black X below and no red. | ||
| <section class=test><div>X</div></section> | ||
| <section class=ref><div>X</div></section> |
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> | ||
| <html lang=en> | ||
| <meta charset="utf-8"> | ||
| <title>CSS Text Test: text-indent percentage resolution basis</title> | ||
| <link rel="author" title="Florian Rivoal" href="http://florian.rivoal.net/"> | ||
| <link rel="help" href="https://drafts.csswg.org/css-text-3/#text-indent-property"> | ||
| <meta name="flags" content=""> | ||
| <link rel="match" href="reference/text-indent-percentage-002-ref.html"> | ||
| <meta name="assert" content="Percentages in text-indent refer to width of the element's content box"> | ||
| <style> | ||
| section { position: absolute; } | ||
| section, div { | ||
| border-right: 10px solid white; | ||
| margin-right: 10px; | ||
| padding-right: 10px; | ||
| } | ||
| div { | ||
| box-sizing: border-box; | ||
| width: 120px; | ||
| } | ||
| .test div { text-indent: 50%; color: red; overflow: hidden; } /* overflow:hidden should not make any difference, but it does in some browsers */ | ||
| .ref div { text-indent: 50px; } | ||
|
There was a problem hiding this comment. Could a test for There was a problem hiding this comment. How is that: d25a341 ? |
||
| </style> | ||
|
|
||
| <p>Test passes if there is a single black X below and no red. | ||
| <section class=test><div>X</div></section> | ||
| <section class=ref><div>X</div></section> | ||
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> | ||
| <html lang=en> | ||
| <meta charset="utf-8"> | ||
| <title>CSS Text Test: text-indent percentage resolution basis, in a calc expressiong</title> | ||
| <link rel="author" title="Florian Rivoal" href="http://florian.rivoal.net/"> | ||
| <link rel="help" href="https://drafts.csswg.org/css-text-3/#text-indent-property"> | ||
| <meta name="flags" content=""> | ||
| <link rel="match" href="reference/text-indent-percentage-002-ref.html"> | ||
| <meta name="assert" content="Percentages in text-indent refer to width of the element's content box, when used in a calc expression"> | ||
| <style> | ||
| section { position: absolute; } | ||
| section, div { | ||
| border-right: 10px solid white; | ||
| margin-right: 10px; | ||
| padding-right: 10px; | ||
| } | ||
| div { | ||
| box-sizing: border-box; | ||
| width: 120px; | ||
| } | ||
| .test div { text-indent: calc(25px + 25%); color: red; } | ||
| .ref div { text-indent: 50px; } | ||
| </style> | ||
|
|
||
| <p>Test passes if there is a single black X below and no red. | ||
| <section class=test><div>X</div></section> | ||
| <section class=ref><div>X</div></section> |
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.
Is there a bug on file for whichever browser this is referring to?
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.
I guess the browser is Gecko looking at the test locally. I'm not sure what's going on there. I'd file and cc @MatsPalmgren who is looking at fixing calc().
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.
I planned to file the bug after the test got approved, but @MatsPalmgren did it first