blitz-dom: table cells are not stretched to the height of their row

From the repository

This page is repros/blitz-dom-table-cell-row-height/README.md, included when the site is built. Edit it there.

What niso does

No workaround in niso. Found by Acid2 (the ul’s third li is 6px instead of 12px). niso’s Element.getBoundingClientRect() is blitz’s get_client_bounding_rect (crates/niso-core/src/api.rs:241), and the render stream places native views at blitz’s layout boxes (crates/niso-core/src/render.rs), so both are off by the same amount.

Where the bug is

blitz-dom layout/table.rs. Cells are grid items of the table’s grid; collect_table_cells resets the cell’s size.width to auto (table.rs:729) but keeps its size.height, so a cell with a definite height is a grid item of that fixed height and align-self: stretch cannot stretch it. In CSS 2.1 §17.5.3 a cell’s height only contributes to the row height; the cell box always spans the whole row.

Expected vs actual

Two cells in one display: table row, height: 20px and height: 5px:

cell #a: expected height 20 (the row's height), actual 20
cell #b: expected height 20 (the row's height), actual 5

Chrome 156: both 20.

Run

CARGO_TARGET_DIR=~/.capy/work/repro-target cargo run

Exit status 1 while the bug reproduces, 0 once fixed. Needs libfontconfig-dev pkg-config on Ubuntu. Built with blitz-dom features system-fonts, accessibility, floats (as niso), viewport 800x600 at scale 1.

Upstream main

Reproduces. Blitz main was still at be60597f67b3cece0456d26e8d7ff5a88600bbc5 (niso’s pin) when tested on 2026-11-08, so the pinned result is the main result.

Tested against open PR https://github.com/DioxusLabs/blitz/pull/1370 (“Use Taffy table layout for CSS tables”, head 0c20c4e7ffadf356bd4ae04bd90e3cf3342da8b2, pins Taffy b2bd579 from DioxusLabs/taffy#1380) with path dependencies on a local checkout: fixed there (exit 0).

Existing issue or PR

No issue for this. Related but different: https://github.com/DioxusLabs/blitz/issues/1431 (open, a cell’s height is used as a fixed height when its content is taller; same root cause, the cell keeps size.height). https://github.com/DioxusLabs/blitz/pull/1370 (open) fixes this case.

Issue text

Title: Table cells with a height are not stretched to their row’s height

Body:

A table cell’s box spans its whole row (CSS 2.1 §17.5.3); its height only feeds the row height. Blitz keeps the cell’s height as its grid item size, so a shorter cell in a taller row stays short (backgrounds, borders and getBoundingClientRect are wrong). Same root cause as #1431.

use blitz_dom::DocumentConfig;
use blitz_html::HtmlDocument;
use blitz_traits::shell::{ColorScheme, Viewport};

const HTML: &str = r#"<body style="margin:0;font:12px/12px sans-serif">
<div style="display:table"><div id="a" style="display:table-cell;height:20px">a</div><div id="b" style="display:table-cell;height:5px">b</div></div></body>"#;

fn main() {
    let config = DocumentConfig { viewport: Some(Viewport::new(800, 600, 1.0, ColorScheme::Light)), ..Default::default() };
    let mut doc = HtmlDocument::from_html(HTML, config);
    doc.resolve(0.0);
    let b = doc.get_element_by_id("b").unwrap();
    println!("{}", doc.get_client_bounding_rect(b).unwrap().height); // Chrome: 20, blitz: 5
}

Tested at be60597; fixed by #1370 (0c20c4e). Without #1370: in collect_table_cells, reset the cell’s size.height to auto like size.width and feed the length into the row’s minimum height.