CSS Grid/CSS-grid-auto-flow.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Grid Auto Flow</title>
    <style>
        :root{
    --black:black;
    --green:palegreen;
    --yellow: #ffc600;
}

html{
    box-sizing: border-box;
    font-size: 12px;
    font-weight: bold;
    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
}
*,
*:before,
*:after {
  box-sizing: inherit;
}
body{
    background: linear-gradient(to right, rgb(241, 39, 17), rgb(245, 175, 25));
    margin: 50px;
}
.item{
    display: grid;
    justify-content: center;
    align-items: center;
    border: 5px solid rgba(0, 0, 0, 0.03);
    border-radius: 3px;
    color: whitesmoke;
    font-size: 35px;
    background-color: var(--yellow); 
}
/* Grid */
.container{
    display: grid;
    grid-template-columns: 100px 200px;
    grid-gap: 20px;
    grid-auto-flow: column;
    grid-auto-columns: 250px;

}
    </style>
</head>
<body>
    <div class="container">
        <div class="item">1</div>
        <div class="item">2</div>
        <div class="item">3</div>
        
    </div>
</body>
</html>             