Centrare verticală în CSS

CSS este încă confuz pentru majoritatea dintre noi: are sute de proprietăți prost numite, fiecare dintre acestea putând afecta rezultatul în moduri neintuitive. Poziționarea verticală a elementelor în dezvoltarea web este dificilă și a provocat adesea dureri de cap în trecut. Dar din fericire acele zile s-au terminat.


Este greu de crezut: în 2024 va fi acum posibil să obțineți rezultatul dorit cu o singură linie de CSS:

0f1273b25d9806459716

0f1273b25d9806459716

În trecut, oamenii foloseau o varietate de alte opțiuni pentru a obține același rezultat:

Flexbox

0f1273b25d9806459716

Poziționare absolută

0f1273b25d9806459716

Bloc inline

0f1273b25d9806459716

The Suport pentru browser pentru align-content este acum foarte bun și nu mai există un argument bun pentru utilizarea tehnicilor învechite. Printre altele, nu mai aveți nevoie de Flexbox pentru această sarcină și elementul copil nu trebuie să fie într-unul separat (spre deosebire de exemplul de mai sus). div fi incluse. Este uimitor că, după decenii de progres, CSS are doar acum o singură proprietate pentru a controla centrarea verticală.

Înapoi