Skip to content

GitLab

T
tangled
Commit 6abfe10d authored by Koji Ishii's avatar Koji Ishii Committed by Commit Bot
Browse files
Options

[LayoutNG] Fix first-line baseline when 'overflow' is not 'visible' 

This patch fixes first-line baseline when the 'overflow'
property is other than 'visible'.

CSS2 states that:
  The baseline of an 'inline-block' is the baseline of its
  last line box in the normal flow, unless it has either no
  in-flow line boxes or if its 'overflow' property has a
  computed value other than 'visible', in which case the
  baseline is the bottom margin edge.
https://drafts.csswg.org/css2/visudet.html#propdef-vertical-align

This rule should apply only to 'inline-block', but it was
incorrectly applied to first-line baseline as well.

This patch fixes incorrect alignment in the comment lines of
Gerrit code review site.

Bug: 636993
Cq-Include-Trybots: luci.chromium.try:linux_layout_tests_layout_ng
Change-Id: I49ffd8c050f384765c61c5678a431fa74492356d
Reviewed-on: https://chromium-review.googlesource.com/1140336Reviewed-by: default avatarEmil A Eklund <eae@chromium.org>
Commit-Queue: Koji Ishii <kojii@chromium.org>
Cr-Commit-Position: refs/heads/master@{#576294}
parent 252a8130
Hide whitespace changes
Inline Side-by-side
Showing with 60 additions and 6 deletions
third_party/WebKit/LayoutTests/external/wpt/css/css-flexbox/align-items-baseline-overflow-non-visible.html 0 → 100644
View file @ 6abfe10d
<!DOCTYPE html>
<title>A block with 'overflow: hidden' should produce normal baseline</title>
<link rel="author" title="Koji Ishii" href="kojii@chromium.org">
<link rel="help" href="https://drafts.csswg.org/css-flexbox/#flex-baselines">
<link rel="match" href="reference/align-items-baseline-overflow-non-visible-ref.html">
<style>
.flex {
display: flex;
align-items: baseline;
}
.overflow {
overflow: hidden;
height: 2em;
}
</style>
<body>
<!--
CSS2 states that:
The baseline of an 'inline-block' is the baseline of its last line box in
the normal flow, unless it has either no in-flow line boxes or if its
'overflow' property has a computed value other than 'visible', in which case
the baseline is the bottom margin edge.
https://drafts.csswg.org/css2/visudet.html#propdef-vertical-align
This rule should apply only to 'inline-block', and not to normal block.
-->
<div class="flex">
<span>XX</span>
<div><div class="overflow">YY</div></div>
</div>
</body>
third_party/WebKit/LayoutTests/external/wpt/css/css-flexbox/reference/align-items-baseline-overflow-non-visible-ref.html 0 → 100644
View file @ 6abfe10d
<!DOCTYPE html>
<style>
.flex {
display: flex;
align-items: baseline;
}
</style>
<body>
<div class="flex">
<span>XX</span>
<div><div>YY</div></div>
</div>
</body>
third_party/blink/renderer/core/layout/ng/inline/ng_baseline.cc
View file @ 6abfe10d
...@@ -39,12 +39,6 @@ bool NGBaseline::ShouldPropagateBaselines(LayoutBox* layout_box) { ...@@ -39,12 +39,6 @@ bool NGBaseline::ShouldPropagateBaselines(LayoutBox* layout_box) {
if (!NGBlockNode(layout_box).CanUseNewLayout()) if (!NGBlockNode(layout_box).CanUseNewLayout())
return true; return true;
// CSS defines certain cases to synthesize baselines from box. See comments in
// UseLogicalBottomMarginEdgeForInlineBlockBaseline().
const LayoutBlock* layout_block = ToLayoutBlock(layout_box);
if (layout_block->UseLogicalBottomMarginEdgeForInlineBlockBaseline())
return false;
return true; return true;
} }
......
third_party/blink/renderer/core/layout/ng/ng_block_layout_algorithm.cc
View file @ 6abfe10d
...@@ -1954,12 +1954,16 @@ void NGBlockLayoutAlgorithm::PropagateBaselinesFromChildren() { ...@@ -1954,12 +1954,16 @@ void NGBlockLayoutAlgorithm::PropagateBaselinesFromChildren() {
for (const auto& request : requests) { for (const auto& request : requests) {
switch (request.algorithm_type) { switch (request.algorithm_type) {
case NGBaselineAlgorithmType::kAtomicInline: case NGBaselineAlgorithmType::kAtomicInline:
if (Node().UseLogicalBottomMarginEdgeForInlineBlockBaseline())
break;
for (unsigned i = container_builder_.Children().size(); i--;) { for (unsigned i = container_builder_.Children().size(); i--;) {
if (AddBaseline(request, container_builder_.Children()[i].get(), if (AddBaseline(request, container_builder_.Children()[i].get(),
container_builder_.Offsets()[i].block_offset)) container_builder_.Offsets()[i].block_offset))
break; break;
} }
break; break;
case NGBaselineAlgorithmType::kFirstLine: case NGBaselineAlgorithmType::kFirstLine:
for (unsigned i = 0; i < container_builder_.Children().size(); i++) { for (unsigned i = 0; i < container_builder_.Children().size(); i++) {
if (AddBaseline(request, container_builder_.Children()[i].get(), if (AddBaseline(request, container_builder_.Children()[i].get(),
......
third_party/blink/renderer/core/layout/ng/ng_block_node.cc
View file @ 6abfe10d
...@@ -620,6 +620,13 @@ bool NGBlockNode::IsAtomicInlineLevel() const { ...@@ -620,6 +620,13 @@ bool NGBlockNode::IsAtomicInlineLevel() const {
return GetLayoutBox()->IsAtomicInlineLevel() && GetLayoutBox()->IsInline(); return GetLayoutBox()->IsAtomicInlineLevel() && GetLayoutBox()->IsInline();
} }
bool NGBlockNode::UseLogicalBottomMarginEdgeForInlineBlockBaseline() const {
LayoutBox* layout_box = GetLayoutBox();
return layout_box->IsLayoutBlock() &&
ToLayoutBlock(layout_box)
->UseLogicalBottomMarginEdgeForInlineBlockBaseline();
}
scoped_refptr<NGLayoutResult> NGBlockNode::LayoutAtomicInline( scoped_refptr<NGLayoutResult> NGBlockNode::LayoutAtomicInline(
const NGConstraintSpace& parent_constraint_space, const NGConstraintSpace& parent_constraint_space,
FontBaseline baseline_type, FontBaseline baseline_type,
......
third_party/blink/renderer/core/layout/ng/ng_block_node.h
View file @ 6abfe10d
...@@ -66,6 +66,10 @@ class CORE_EXPORT NGBlockNode final : public NGLayoutInputNode { ...@@ -66,6 +66,10 @@ class CORE_EXPORT NGBlockNode final : public NGLayoutInputNode {
bool IsInlineLevel() const; bool IsInlineLevel() const;
bool IsAtomicInlineLevel() const; bool IsAtomicInlineLevel() const;
// CSS defines certain cases to synthesize inline block baselines from box.
// See comments in UseLogicalBottomMarginEdgeForInlineBlockBaseline().
bool UseLogicalBottomMarginEdgeForInlineBlockBaseline() const;
// Layout an atomic inline; e.g., inline block. // Layout an atomic inline; e.g., inline block.
scoped_refptr<NGLayoutResult> LayoutAtomicInline(const NGConstraintSpace&, scoped_refptr<NGLayoutResult> LayoutAtomicInline(const NGConstraintSpace&,
FontBaseline, FontBaseline,
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment