Autoprefixer CSS online
Grid

Grid minmax()

przykład 1

<div class="wrap">
    <div>grid 1</div>
    <div>grid 2</div>
    <div>grid 3</div>
</div>Code language: HTML, XML (xml)
.wrap {
    display: grid;
    grid-template-columns: minmax(100px, 500px) 1fr 1fr;
    grid-template-rows: 70px;
    grid-gap: 5px;
}Code language: CSS (css)
grid 1
grid 2
grid 3

przykład 2

<div class="wrap">
    <div>grid 1</div>
    <div>grid 2</div>
    <div>grid 3</div>
</div>Code language: HTML, XML (xml)
.wrap {
display: grid;
grid-template-columns: minmax(100px, 1fr) minmax(100px, 1fr) minmax(100px, 1fr);
grid-template-rows: 70px;
grid-gap: 5px;
}

INNY SPOSÓB ZAPISU CSS:

.wrap {
display: grid;
grid-template-columns: repeat(3, minmax(100px, 1fr));
grid-template-rows: 70px;
grid-gap: 5px;
}Code language: CSS (css)
grid 1
grid 2
grid 3