Pixel und fr-Einheiten in CSS Grids
Die Breite der Spalten kann
gleichzeitig in Pixeln und
fr angegeben werden:
<div id="parent">
<div>1</div>
<div>2</div>
<div>3</div>
<div>4</div>
<div>5</div>
<div>6</div>
<div>7</div>
<div>8</div>
<div>9</div>
</div>
#parent {
display: grid;
grid-template-columns: 100px 1fr 50px;
border: 2px solid #696989;
padding: 10px;
width: 600px;
}
#parent > div {
padding: 10px;
border: 1px solid #696989;
}
:
Angenommen, Ihr Grid hat drei Spalten.
Sorgen Sie dafür, dass die erste Spalte
100px einnimmt, und die restlichen
beiden Spalten die gleiche Größe
haben.
Angenommen, Ihr Grid hat vier Spalten.
Sorgen Sie dafür, dass die erste und die letzte
Spalte 100px einnehmen,
und die restlichen Spalten den verbleibenden
Platz so aufteilen, dass die dritte Spalte 1.5
mal so groß wie die zweite ist.