Pikslji in enote fr v CSS mrežah
Širino stolpcev lahko določimo
hkrati v pikslih in
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;
}
:
Naj ima vaša mreža tri stolpce.
Naredite tako, da bo prvi stolpec
zasedel 100px, preostala
dva stolpca pa naj bosta enake
velikosti.
Naj ima vaša mreža štiri stolpce.
Naredite tako, da bosta prvi in zadnji
stolpec zasedla 100px,
preostali stolpci pa naj si razporedijo preostali
prostor tako, da bo tretji stolpec 1.5
krat večji od drugega.