Title: [271284] trunk
- Revision
- 271284
- Author
- [email protected]
- Date
- 2021-01-07 20:38:05 -0800 (Thu, 07 Jan 2021)
Log Message
paypal.com: text at the bottom of the page is not aligned properly
https://bugs.webkit.org/show_bug.cgi?id=220444
<rdar://problem/60356338>
Reviewed by Simon Fraser.
Source/WebCore:
This patch addresses the case when we try to align text content inside an inline level box with display type of inline-block.
While ideally only the inline level boxes would participate in the vertical alignment process, in legacy line layout we align the text content as well.
The verticalAlignApplies() function filters out the cases when the text content should default to baseline. It was checking against "inline" to
ensure
"<div style="vertical-align: top">foobar</div>" works and it missed the following case "<div style="display: inline-block; vertical-align:top">foobar</div>" <- inline level box but "foobar" should be baseline aligned.
Tests: fast/inline/incorrect-vertical-alignment-inside-inline-block.html
* rendering/InlineFlowBox.cpp:
(WebCore::verticalAlignApplies):
LayoutTests:
* fast/css/vertical-align-block-elements-expected.html:
* fast/css/vertical-align-block-elements.html:
* fast/inline/incorrect-vertical-alignment-inside-inline-block-expected.html: Added.
* fast/inline/incorrect-vertical-alignment-inside-inline-block.html: Added.
Modified Paths
Added Paths
Diff
Modified: trunk/LayoutTests/ChangeLog (271283 => 271284)
--- trunk/LayoutTests/ChangeLog 2021-01-08 03:59:24 UTC (rev 271283)
+++ trunk/LayoutTests/ChangeLog 2021-01-08 04:38:05 UTC (rev 271284)
@@ -1,3 +1,16 @@
+2021-01-07 Zalan Bujtas <[email protected]>
+
+ paypal.com: text at the bottom of the page is not aligned properly
+ https://bugs.webkit.org/show_bug.cgi?id=220444
+ <rdar://problem/60356338>
+
+ Reviewed by Simon Fraser.
+
+ * fast/css/vertical-align-block-elements-expected.html:
+ * fast/css/vertical-align-block-elements.html:
+ * fast/inline/incorrect-vertical-alignment-inside-inline-block-expected.html: Added.
+ * fast/inline/incorrect-vertical-alignment-inside-inline-block.html: Added.
+
2021-01-07 Ryan Haddad <[email protected]>
[ Mac ] http/wpt/service-workers/service-worker-spinning-install.https.html is flaky failing
Modified: trunk/LayoutTests/fast/css/vertical-align-block-elements-expected.html (271283 => 271284)
--- trunk/LayoutTests/fast/css/vertical-align-block-elements-expected.html 2021-01-08 03:59:24 UTC (rev 271283)
+++ trunk/LayoutTests/fast/css/vertical-align-block-elements-expected.html 2021-01-08 04:38:05 UTC (rev 271284)
@@ -13,7 +13,7 @@
</script>
</head>
<body>
- <p>Bug: webkit.org/b/111974 - vertical-align only applies to inline-level elements and table-cells. The text below should be aligned horiontally.
+ <p>Bug: webkit.org/b/111974 - vertical-align only applies to inline-level elements and table-cells. The text below should be aligned horizontally.
<div>
<button>All </button> This <span>text</span> is <a href=""
</div>
Modified: trunk/LayoutTests/fast/css/vertical-align-block-elements.html (271283 => 271284)
--- trunk/LayoutTests/fast/css/vertical-align-block-elements.html 2021-01-08 03:59:24 UTC (rev 271283)
+++ trunk/LayoutTests/fast/css/vertical-align-block-elements.html 2021-01-08 04:38:05 UTC (rev 271284)
@@ -15,7 +15,7 @@
</script>
</head>
<body>
- <p>Bug: webkit.org/b/111974 - vertical-align only applies to inline-level elements and table-cells. The text below should be aligned horiontally.
+ <p>Bug: webkit.org/b/111974 - vertical-align only applies to inline-level elements and table-cells. The text below should be aligned horizontally.
<div>
<button>All </button> This <span>text</span> is <a href=""
</div>
Added: trunk/LayoutTests/fast/inline/incorrect-vertical-alignment-inside-inline-block-expected.html (0 => 271284)
--- trunk/LayoutTests/fast/inline/incorrect-vertical-alignment-inside-inline-block-expected.html (rev 0)
+++ trunk/LayoutTests/fast/inline/incorrect-vertical-alignment-inside-inline-block-expected.html 2021-01-08 04:38:05 UTC (rev 271284)
@@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<style>
+div {
+ font-size: 10px;
+}
+
+span {
+ font-size: 30px;
+}
+
+</style>
+<div>this<span>should all be</span>aligned</div>
Added: trunk/LayoutTests/fast/inline/incorrect-vertical-alignment-inside-inline-block.html (0 => 271284)
--- trunk/LayoutTests/fast/inline/incorrect-vertical-alignment-inside-inline-block.html (rev 0)
+++ trunk/LayoutTests/fast/inline/incorrect-vertical-alignment-inside-inline-block.html 2021-01-08 04:38:05 UTC (rev 271284)
@@ -0,0 +1,14 @@
+<!DOCTYPE html>
+<style>
+div {
+ display: inline-block;
+ vertical-align: top;
+ font-size: 10px;
+}
+
+span {
+ font-size: 30px;
+}
+
+</style>
+<div>this<span>should all be</span>aligned</div>
\ No newline at end of file
Modified: trunk/Source/WebCore/ChangeLog (271283 => 271284)
--- trunk/Source/WebCore/ChangeLog 2021-01-08 03:59:24 UTC (rev 271283)
+++ trunk/Source/WebCore/ChangeLog 2021-01-08 04:38:05 UTC (rev 271284)
@@ -1,3 +1,23 @@
+2021-01-07 Zalan Bujtas <[email protected]>
+
+ paypal.com: text at the bottom of the page is not aligned properly
+ https://bugs.webkit.org/show_bug.cgi?id=220444
+ <rdar://problem/60356338>
+
+ Reviewed by Simon Fraser.
+
+ This patch addresses the case when we try to align text content inside an inline level box with display type of inline-block.
+
+ While ideally only the inline level boxes would participate in the vertical alignment process, in legacy line layout we align the text content as well.
+ The verticalAlignApplies() function filters out the cases when the text content should default to baseline. It was checking against "inline" to
+ ensure
+ "<div style="vertical-align: top">foobar</div>" works and it missed the following case "<div style="display: inline-block; vertical-align:top">foobar</div>" <- inline level box but "foobar" should be baseline aligned.
+
+ Tests: fast/inline/incorrect-vertical-alignment-inside-inline-block.html
+
+ * rendering/InlineFlowBox.cpp:
+ (WebCore::verticalAlignApplies):
+
2021-01-07 Eric Carlson <[email protected]>
[Mac] Add runtime logging to format reader and WebM parser
Modified: trunk/Source/WebCore/rendering/InlineFlowBox.cpp (271283 => 271284)
--- trunk/Source/WebCore/rendering/InlineFlowBox.cpp 2021-01-08 03:59:24 UTC (rev 271283)
+++ trunk/Source/WebCore/rendering/InlineFlowBox.cpp 2021-01-08 04:38:05 UTC (rev 271284)
@@ -489,9 +489,12 @@
static bool verticalAlignApplies(const RenderObject& renderer)
{
- // http://www.w3.org/TR/CSS2/visudet.html#propdef-vertical-align - vertical-align
- // only applies to inline level and table-cell elements
- return !renderer.isText() || renderer.parent()->isInline() || renderer.parent()->isTableCell();
+ // http://www.w3.org/TR/CSS2/visudet.html#propdef-vertical-align - vertical-align only applies to inline level and table-cell elements.
+ // FIXME: Ideally we would only align inline level boxes which means that text inside an inline box would just sit on the box itself.
+ if (!renderer.isText())
+ return true;
+ auto& parentRenderer = *renderer.parent();
+ return (parentRenderer.isInline() && parentRenderer.style().display() != DisplayType::InlineBlock) || parentRenderer.isTableCell();
}
void InlineFlowBox::adjustMaxAscentAndDescent(int& maxAscent, int& maxDescent, int maxPositionTop, int maxPositionBottom)
_______________________________________________
webkit-changes mailing list
[email protected]
https://lists.webkit.org/mailman/listinfo/webkit-changes
