Automatic Placement when using CSS Grid Layout

Posted byBramus! Leave a comment on Automatic Placement when using CSS Grid Layout 
<div style="display: grid;">
    <div style="grid-row: 1; grid-column: 2;">item 1</div>
    <div style="grid-column: span 2;">item 2</div>
    <div>item 3</div>
</div>

Setting grid-auto-flow to different values will change the way blocks are placed

auto-placement-grid-auto-flow-1024x385

CSS Grid Layout Automatic Placement →

Published by Bramus!

Bramus is a frontend web developer from Belgium, working as a Chrome Developer Relations Engineer at Google. From the moment he discovered view-source at the age of 14 (way back in 1997), he fell in love with the web and has been tinkering with it ever since (more …)

Leave a comment

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.