From 7fc988b9192642ffa15b845972373d02090fff82 Mon Sep 17 00:00:00 2001 From: Andreas Kling Date: Sun, 28 Jun 2020 15:11:08 +0200 Subject: LibWeb: Start working on supporting fixed table layouts Sometimes people make tables with a specific width. In those cases, we can't just use the auto-sizing algorithm, but instead have to respect whatever width the content specifies. This is a bit rickety right now, since we don't implement generation of anonymous table boxes. The basic mechanism here is that block layout (which table-cell uses) now has a virtual way of asking for the width of the logical containing block. This is necessary as table-row does not produce a block-level element and so was previously unable to provide a containing block width for table-cell layout. If the table has a non-auto specified width, we now interpret that as a request to use fixed table layout. This will evolve over time. :^) --- Libraries/LibWeb/Layout/LayoutBlock.cpp | 30 ++++++++++++++++++----------- Libraries/LibWeb/Layout/LayoutBlock.h | 2 ++ Libraries/LibWeb/Layout/LayoutTableCell.cpp | 8 ++++++++ Libraries/LibWeb/Layout/LayoutTableCell.h | 1 + Libraries/LibWeb/Layout/LayoutTableRow.cpp | 17 ++++++++++++++-- 5 files changed, 45 insertions(+), 13 deletions(-) diff --git a/Libraries/LibWeb/Layout/LayoutBlock.cpp b/Libraries/LibWeb/Layout/LayoutBlock.cpp index 5db9df28e8..c212b89db8 100644 --- a/Libraries/LibWeb/Layout/LayoutBlock.cpp +++ b/Libraries/LibWeb/Layout/LayoutBlock.cpp @@ -419,23 +419,31 @@ void LayoutBlock::compute_width_for_absolutely_positioned_block() box_model().padding.right = padding_right; } +float LayoutBlock::width_of_logical_containing_block() const +{ + auto* containing_block = this->containing_block(); + ASSERT(containing_block); + return containing_block->width(); +} + void LayoutBlock::compute_width() { if (is_absolutely_positioned()) return compute_width_for_absolutely_positioned_block(); - auto& containing_block = *this->containing_block(); + float width_of_containing_block = this->width_of_logical_containing_block(); + auto zero_value = Length::make_px(0); auto margin_left = Length::make_auto(); auto margin_right = Length::make_auto(); - const auto padding_left = style().padding().left.resolved_or_zero(*this, containing_block.width()); - const auto padding_right = style().padding().right.resolved_or_zero(*this, containing_block.width()); + const auto padding_left = style().padding().left.resolved_or_zero(*this, width_of_containing_block); + const auto padding_right = style().padding().right.resolved_or_zero(*this, width_of_containing_block); auto try_compute_width = [&](const auto& a_width) { Length width = a_width; - margin_left = style().margin().left.resolved_or_zero(*this, containing_block.width()); - margin_right = style().margin().right.resolved_or_zero(*this, containing_block.width()); + margin_left = style().margin().left.resolved_or_zero(*this, width_of_containing_block); + margin_right = style().margin().right.resolved_or_zero(*this, width_of_containing_block); float total_px = style().border_left().width + style().border_right().width; for (auto& value : { margin_left, padding_left, width, padding_right, margin_right }) { @@ -449,7 +457,7 @@ void LayoutBlock::compute_width() if (!is_replaced() && !is_inline()) { // 10.3.3 Block-level, non-replaced elements in normal flow // If 'width' is not 'auto' and 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' (plus any of 'margin-left' or 'margin-right' that are not 'auto') is larger than the width of the containing block, then any 'auto' values for 'margin-left' or 'margin-right' are, for the following rules, treated as zero. - if (width.is_auto() && total_px > containing_block.width()) { + if (width.is_auto() && total_px > width_of_containing_block) { if (margin_left.is_auto()) margin_left = zero_value; if (margin_right.is_auto()) @@ -457,7 +465,7 @@ void LayoutBlock::compute_width() } // 10.3.3 cont'd. - auto underflow_px = containing_block.width() - total_px; + auto underflow_px = width_of_containing_block - total_px; if (width.is_auto()) { if (margin_left.is_auto()) @@ -499,7 +507,7 @@ void LayoutBlock::compute_width() // Find the available width: in this case, this is the width of the containing // block minus the used values of 'margin-left', 'border-left-width', 'padding-left', // 'padding-right', 'border-right-width', 'margin-right', and the widths of any relevant scroll bars. - float available_width = containing_block.width() + float available_width = width_of_containing_block - margin_left.to_px(*this) - style().border_left().width - padding_left.to_px(*this) - padding_right.to_px(*this) - style().border_right().width - margin_right.to_px(*this); @@ -513,14 +521,14 @@ void LayoutBlock::compute_width() return width; }; - auto specified_width = style().width().resolved_or_auto(*this, containing_block.width()); + auto specified_width = style().width().resolved_or_auto(*this, width_of_containing_block); // 1. The tentative used width is calculated (without 'min-width' and 'max-width') auto used_width = try_compute_width(specified_width); // 2. The tentative used width is greater than 'max-width', the rules above are applied again, // but this time using the computed value of 'max-width' as the computed value for 'width'. - auto specified_max_width = style().max_width().resolved_or_auto(*this, containing_block.width()); + auto specified_max_width = style().max_width().resolved_or_auto(*this, width_of_containing_block); if (!specified_max_width.is_auto()) { if (used_width.to_px(*this) > specified_max_width.to_px(*this)) { used_width = try_compute_width(specified_max_width); @@ -529,7 +537,7 @@ void LayoutBlock::compute_width() // 3. If the resulting width is smaller than 'min-width', the rules above are applied again, // but this time using the value of 'min-width' as the computed value for 'width'. - auto specified_min_width = style().min_width().resolved_or_auto(*this, containing_block.width()); + auto specified_min_width = style().min_width().resolved_or_auto(*this, width_of_containing_block); if (!specified_min_width.is_auto()) { if (used_width.to_px(*this) < specified_min_width.to_px(*this)) { used_width = try_compute_width(specified_min_width); diff --git a/Libraries/LibWeb/Layout/LayoutBlock.h b/Libraries/LibWeb/Layout/LayoutBlock.h index 8f8f31a4d9..17d1ccbbd2 100644 --- a/Libraries/LibWeb/Layout/LayoutBlock.h +++ b/Libraries/LibWeb/Layout/LayoutBlock.h @@ -70,6 +70,8 @@ protected: void compute_height(); void layout_absolutely_positioned_descendants(); + virtual float width_of_logical_containing_block() const; + private: virtual bool is_block() const override { return true; } diff --git a/Libraries/LibWeb/Layout/LayoutTableCell.cpp b/Libraries/LibWeb/Layout/LayoutTableCell.cpp index f483a9f9c0..9621271843 100644 --- a/Libraries/LibWeb/Layout/LayoutTableCell.cpp +++ b/Libraries/LibWeb/Layout/LayoutTableCell.cpp @@ -26,6 +26,7 @@ #include #include +#include namespace Web { @@ -44,4 +45,11 @@ size_t LayoutTableCell::colspan() const return to(*node()).attribute(HTML::AttributeNames::colspan).to_uint().value_or(1); } +float LayoutTableCell::width_of_logical_containing_block() const +{ + if (auto* row = first_ancestor_of_type()) + return row->width(); + return 0; +} + } diff --git a/Libraries/LibWeb/Layout/LayoutTableCell.h b/Libraries/LibWeb/Layout/LayoutTableCell.h index 58be077b19..3edf83352a 100644 --- a/Libraries/LibWeb/Layout/LayoutTableCell.h +++ b/Libraries/LibWeb/Layout/LayoutTableCell.h @@ -43,6 +43,7 @@ public: private: virtual bool is_table_cell() const override { return true; } virtual const char* class_name() const override { return "LayoutTableCell"; } + virtual float width_of_logical_containing_block() const override; }; template<> diff --git a/Libraries/LibWeb/Layout/LayoutTableRow.cpp b/Libraries/LibWeb/Layout/LayoutTableRow.cpp index 8800965a61..f1df800d11 100644 --- a/Libraries/LibWeb/Layout/LayoutTableRow.cpp +++ b/Libraries/LibWeb/Layout/LayoutTableRow.cpp @@ -25,6 +25,7 @@ */ #include +#include #include #include @@ -47,7 +48,12 @@ void LayoutTableRow::calculate_column_widths(Vector& column_widths) { size_t column_index = 0; for_each_child_of_type([&](auto& cell) { - cell.layout(LayoutMode::OnlyRequiredLineBreaks); + auto* table = first_ancestor_of_type(); + if (table && !table->style().width().is_undefined_or_auto()) { + cell.layout(LayoutMode::Default); + } else { + cell.layout(LayoutMode::OnlyRequiredLineBreaks); + } column_widths[column_index] = max(column_widths[column_index], cell.width()); column_index += cell.colspan(); }); @@ -67,7 +73,14 @@ void LayoutTableRow::layout_row(const Vector& column_widths) content_width += column_widths[column_index++]; tallest_cell_height = max(tallest_cell_height, cell.height()); }); - set_width(content_width); + + auto* table = first_ancestor_of_type(); + if (table && !table->style().width().is_undefined_or_auto()) { + set_width(table->width()); + } else { + set_width(content_width); + } + set_height(tallest_cell_height); } -- cgit v1.2.3