Grid-auto-columns xassəsi

grid-auto-columns xassəsi gizli griddə elementin tutacağı sütunların sayı və enini təyin edir. Gizli grid - artıq təyin edilmiş gridin çərçivəsindən kənara çıxan elementlər üçün avtomatik yaradılan griddir. Xassənin qiymətində sütunların enini istənilən ölçü vahidində təyin edirik. Xassə valideyn elementdə yazılır və övlad elementlərin sütun enlərini müəyyən edir.

Sintaksis

selektor {
	grid-auto-columns: sütun eni;
}

Nümunə

Gəlin gizli griddə elementlərimiz üçün sütun enlərini təyin edək:

<div id="parent">
	<div>1</div>
	<div>2</div>
	<div>3</div>
	<div>4</div>
	<div>5</div>
</div>

#parent {
	display: grid;
	grid-template-rows: 40px 40px;
	grid-auto-columns: 200px;
	border: 2px solid #696989;
	padding: 10px;
}
#parent > div {
	padding: 10px;
	border: 1px solid #696989;
}

Həmçinin bax

grid-auto-rows xassəsi,
gizli griddə sıraların sayı və enini təyin edir
grid-template-columns xassəsi,
griddə sütunların sayı və enini təyin edir