Ուղղահայաց կենտրոնացում CSS-ում

CSS-ը դեռևս շփոթեցնող է մեզանից շատերի համար. այն ունի հարյուրավոր վատ անուններով հատկություններ, որոնցից յուրաքանչյուրը կարող է ազդել արդյունքի վրա ոչ ինտուիտիվ ձևերով: Վեբ մշակման մեջ տարրերի ուղղահայաց դիրքավորումը բարդ է և նախկինում հաճախ գլխացավեր է առաջացրել: Բայց բարեբախտաբար այդ օրերն անցել են։


Դժվար է հավատալ. 2024 թվականին CSS-ի մեկ տողով այժմ հնարավոր կլինի հասնել ցանկալի արդյունքի:

0f1273b25d9806459716

0f1273b25d9806459716

Նախկինում մարդիկ օգտագործում էին մի շարք այլ տարբերակներ՝ նույն արդյունքի հասնելու համար:

Flexbox

0f1273b25d9806459716

Բացարձակ դիրքավորում

0f1273b25d9806459716

Ներքին բլոկ

0f1273b25d9806459716

Այն Բրաուզերի աջակցություն align-content-ի համար այժմ շատ լավ է, և այլևս լավ փաստարկ չկա հնացած տեխնիկայի օգտագործման համար: Ի թիվս այլ բաների, ձեզ այլևս Flexbox-ի կարիք չկա այս առաջադրանքի համար, և պարտադիր չէ, որ երեխայի տարրը առանձին լինի (ի տարբերություն վերը նշված օրինակի): div ներառվել. Զարմանալի է, որ տասնամյակների առաջընթացից հետո CSS-ը միայն այժմ ունի մեկ հատկություն՝ ուղղահայաց կենտրոնացումը կառավարելու համար:

Վերադառնալ