Mirrors/servo
1
0
Fork 0
mirror of https://github.com/servo/servo.git synced 2025-08-06 14:10:11 +01:00
Code Issues Projects Releases Packages Wiki Activity

layout: Include spanned gutters when laying out contents of table cell (#38290)

Browse source 
If a cell would e.g. span 2 columns, each 50px wide, separated by a 10px
gutter, then we used to lay out the contents of the cell with a 100px
wide containing block. Now we will include the size of the gutter.

Testing: Adding new test
Fixes: #38277

Signed-off-by: Oriol Brufau <obrufau@igalia.com>
This commit is contained in:
Oriol Brufau 2025-07-29 10:57:22 +02:00 • committed by GitHub
parent 61273a4321
commit 7ce5de4e2d
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
3 changed files with 35 additions and 1 deletions
Download patch file Download diff file Expand all files Collapse all files

5
components/layout/table/layout.rs
View file

@ -1091,11 +1091,14 @@ impl<'a> TableLayout<'a> {
.padding(containing_block_for_table.style.writing_mode)
.percentages_relative_to(self.basis_for_cell_padding_percentage);
let inline_border_padding_sum = border.inline_sum() + padding.inline_sum();
let border_spacing_spanned =
self.table.border_spacing().inline * (cell.colspan - 1) as i32;
let mut total_cell_width: Au = (coordinate.x..coordinate.x + cell.colspan)
.map(|column_index| self.distributed_column_widths[column_index])
.sum::<Au>() -
inline_border_padding_sum;
inline_border_padding_sum +
border_spacing_spanned;
total_cell_width = total_cell_width.max(Au::zero());
let containing_block_for_children = ContainingBlock {

13
tests/wpt/meta/MANIFEST.json vendored
View file

@ -107621,6 +107621,19 @@
{}
]
],
"border-spacing-095.html": [
"8e5c8f55ccaeb749894a63970ac349cfbce98d53",
[
null,
[
[
"/css/reference/ref-filled-green-100px-square.xht",
"=="
]
],
{}
]
],
"border-spacing-applies-to-016.xht": [
"0536763244237b77645937fe30e4898f1efcbfb5",
[

18
tests/wpt/tests/css/CSS2/tables/border-spacing-095.html vendored Normal file
View file

@ -0,0 +1,18 @@
<!DOCTYPE html>
<title>CSS Test: Border-spacing: cell spanning multiple columns</title>
<link rel="author" title="Oriol Brufau" href="obrufau@igalia.com">
<link rel="help" href="https://www.w3.org/TR/CSS2/tables.html#propdef-border-spacing">
<link rel="help" href="https://github.com/servo/servo/issues/38277">
<link rel="match" href="../../reference/ref-filled-green-100px-square.xht">
<meta name="assert" content="The cell spans 3 columns and 2 gutters, each 20px wide.
The contents of the cell should be able to use the entire 100px, not just the 60px
of the columns.">
<p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
<table cellpadding="0" style="border-spacing: 20px; margin: -20px">
<tr>
<td colspan="3" style="width: 100px; background: red">
<div style="height: 100px; background: green"></div>
</td>
</tr>
</table>