What does grid-auto-flow: dense do?

What does grid-auto-flow: dense do?

• A. It starts by filling gaps with the first items only.
• B. It can fill gaps by placing later items into holes.
• C. It prevents any holes from forming.
• D. It sorts items by their source order.

Answer: (B)

Grid auto-flow controls how items that aren’t explicitly placed get laid out in the grid. When you use dense packing, the browser tries hard to fill every empty space by allowing items that come later in the DOM to slide into holes left by earlier placements. This makes the grid more compact and minimizes gaps, but it can cause items to appear in different positions than their order in the source, since a later item might be placed into a hole created by a previous tall item. It doesn’t mean only the first items fill gaps, it doesn’t guarantee there will never be holes, and it doesn’t sort items by source order—the packing rule simply fills gaps as efficiently as possible.

Grid auto-flow controls how items that aren’t explicitly placed get laid out in the grid. When you use dense packing, the browser tries hard to fill every empty space by allowing items that come later in the DOM to slide into holes left by earlier placements. This makes the grid more compact and minimizes gaps, but it can cause items to appear in different positions than their order in the source, since a later item might be placed into a hole created by a previous tall item. It doesn’t mean only the first items fill gaps, it doesn’t guarantee there will never be holes, and it doesn’t sort items by source order—the packing rule simply fills gaps as efficiently as possible.