bug(cdk-virtual-scroll-viewport): renders gaps between items

[yichengyiguo]

Is this a regression?

• Yes, this behavior used to work in the previous version

The previous version in which this bug was not present was

No response

Description

When using cdk-virtual-scroll-viewport with *cdkVirtualFor, items are sometimes rendered with visible gaps between rows. This seems to be caused by subpixel rounding when calculating item offsets.

Reproduction

StackBlitz link:
Steps to reproduce:

1. Set a solid background color for the cdk-virtual-scroll-viewport.
2. Set a different background color for each item rendered with *cdkVirtualFor.
3. Zoom the browser window (e.g. 300%) and scroll quickly through the list.

Expected Behavior

Rows should be rendered continuously without visible gaps between them.

Actual Behavior

At certain scroll positions or zoom levels, a thin gap (about 0.5px) appears between consecutive rows.

Environment

Angular: 20.2.2

Angular CDK: 20.2.2

Browser: Chrome 139, Edge 139 (Windows 10, macOS tested)

[yichengyiguo]

hello @andrewseguin @mmalerba @Mr-KRAMA ,version 20.2.8 still has this issue. Could you please confirm if it’s expected or if a fix is planned in a future release?