Lastnost aspect-ratio

Lastnost aspect-ratio določa poravnavo elementov vzdolž prečne osi za fleks bloke in po vodoravni osi za mreže. Uporablja se za nadrejeni element.

Sintaksa

selektor {
	aspect-ratio: auto ali razmerje;
}

Vrednost	Opis
`auto`	Element nima prednostnega razmerja stranic in brskalnik ga nastavi samodejno, na podlagi širine in višine elementa.
`razmerje`	Razmerje je zapisano v obliki `16/9`, tukaj je prva številka širina, druga številka pa višina. Če kakšna vrednost ni navedena, velja, da je enaka `1`. Prav tako nekatere razmerja lahko zapišemo z eno številko. Na primer, `2/1` lahko zapišemo kot `0.5`, kar bo dalo enak rezultat.
`auto && razmerje`	Če gre razmerje stranic skupaj s ključno besedo `auto` (primer: `auto` `1/2`), bo izbrano navedeno razmerje, vendar bo za nadomeščene elemente (kot so slike in videoposnetki) z lastnim razmerjem uporabljeno le to.

Nastavimo samodejno razmerje stranic za gumb:

<p>
	<button>Click</button>
</p>

button {
	aspect-ratio: auto;
	background-color: #9DDFA4;
	padding: 1em;
}

Zdaj pa določimo razmerje stranic za gumb kot 1/2:

<p>
	<button>Click</button>
</p>

button {
	aspect-ratio: 1/2;
	background-color: #9DDFA4;
	padding: 1em;
}