Source code

Revision control

Copy as Markdown

Other Tools

Test Info:

<!DOCTYPE html>
<html>
<link rel="help" href="https://drafts.csswg.org/css-grid-3">
<link rel="author" title="Alison Maher" href="mailto:almaher@microsoft.com">
<link rel="match" href="column-track-sizing-003-ref.html">
<style>
.masonry {
display: masonry;
grid-template-columns: 1fr 5fr 3fr 1fr;
width: 100px;
height: 100px;
}
</style>
<body>
<p>Test that masonry tracks are correctly sized, and flexible tracks are expanded.</p>
<div class="masonry">
<div style="background-color: orange; height: 100px;"></div>
<div style="background-color: yellow; height: 100px;"></div>
<div style="background-color: blue; height: 100px;"></div>
<div style="background-color: purple; height: 100px;"></div>
</div>
</body>
</html>