Pikslid ja fr ühikud CSS grid'ides
Veergude laiuse saab määrata
samaaegselt nii piksleites kui ka
fr ühikutes:
<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;
}
:
Olgu teie grid'il kolm veergu.
Seadke see nii, et esimene veerg
võtaks 100px, ja ülejäänud
kaks veergu oleksid ühesuguse
suurusega.
Olgu teie grid'il neli veergu.
Seadke see nii, et esimene ja viimane
veerg võtaksid 100px,
ja ülejäänud veerud jagaksid allesjäänud
ruumi nii, et kolmas veerg oleks 1.5
korda suurem kui teine.
