Арзиши auto дар CSS grid

Дар grid ҳангоми муайян кардани андозаи сатрҳо ва сутунҳо метавон арзиши auto-ро истифода бурд. Дар ин ҳолат, блокҳо танҳо ҳамаи фазои озоди дастрасро пур мекунанд ба истиснои он паҳное, ки дар пикселҳо муайян шудааст. Биёед ба мисолҳо нигарем.

Биёед ба сутуни аввал ва сеюм паҳнои собит дар пикселҳо муайян кунем, ва сутуни дуюм биёед ба таври худкор ҷойи бозмондаро ишғол кунад:

<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>

#parent {
	display: grid;
	grid-template-columns: 100px auto 150px;
	border: 2px solid #696989;
	padding: 10px;
	width: 600px;
}
#parent > div {
	padding: 10px;
	border: 1px solid #696989;
}

Элементҳои фарзандро дар ду сутун ҷойгир кунед: сутуни аввал паҳнояш 200px, ва сутуни дуюм биёед ҷои бозмондаро ишғол кунад.

Элементҳои фарзандро дар се сутун ҷойгир кунед: сутуни аввал паҳнояш 100px, сутуни дуюм 150px, ва сутуни сеюм биёед ҷои бозмондаро ишғол кунад.