Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix: positioned element logical width/height calculation #1053

Merged
merged 3 commits into from Jan 6, 2022

Conversation

temper357
Copy link
Contributor

@temper357 temper357 commented Jan 5, 2022

Closes #1051

  • 对于 width 为 auto, left/right 不为 auto 的 positioned element(absolute/fixed) 应该使用 parent 的 width 撑开,原来这个 logical width 的计算逻辑放在 layout 阶段做的,导致 renderStyle 上的 logicalWidth 未被正确赋值,正确做法是将此逻辑移入 computeLogicalWidth 中处理。对于 height 为 auto, top/bottom 不为 auto 的 positioned element 相同处理。

@temper357 temper357 changed the title [WIP] fix: positioned element logical width/height calculation fix: positioned element logical width/height calculation Jan 5, 2022
// The width of positioned, non-replaced element is determined as following algorithm.
// https://www.w3.org/TR/css-position-3/#abs-non-replaced-width
} else if ((renderStyle.position == CSSPositionType.absolute ||
renderStyle.position == CSSPositionType.fixed)
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

sticky 需要考虑吗

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

翻了下上面的文档, 应该是不需要的 忽略

// The width of positioned, non-replaced element is determined as following algorithm.
// https://www.w3.org/TR/css-position-3/#abs-non-replaced-width
} else if ((renderStyle.position == CSSPositionType.absolute ||
renderStyle.position == CSSPositionType.fixed)
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

翻了下上面的文档, 应该是不需要的 忽略

}
// Should access the renderStyle of renderBoxModel parent but not renderStyle parent
// cause the element of renderStyle parent may not equal to containing block.
RenderBoxModel parent = current.parent as RenderBoxModel;
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

这里会不会 parent 不存在?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

上面的判断 current.parent is! RenderBoxModel 已经排除了 parent 为 null 的 case

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

OK

@wssgcg1213 wssgcg1213 merged commit 33fda44 into main Jan 6, 2022
@wssgcg1213 wssgcg1213 deleted the fix/positioned-element-logical-size branch January 6, 2022 08:39
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

position absolute 且 left, right 为 0 的 flex 容器 child 未能用 align-items stretch 撑开
3 participants