Piksler og fr-enheter i CSS-grid
Å sette bredden på kolonnene kan
gjøres samtidig i piksler og
fr:
<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;
}
:
La oss si at griddet ditt har tre kolonner.
Gjør slik at den første kolonnen
tar 100px, og de andre
to kolonnene har samme
størrelse.
La oss si at griddet ditt har fire kolonner.
Gjør slik at den første og siste
kolonnen tar 100px,
og de andre kolonnene deler det gjenværende
plassen slik at den tredje kolonnen er 1.5
ganger større enn den andre.
