مرکز عمودی در CSS

CSS هنوز برای بسیاری از ما گیج کننده است: دارای صدها ویژگی نامناسب است که هر یک می توانند نتیجه را به روش های غیر شهودی تحت تأثیر قرار دهند. موقعیت عمودی عناصر در توسعه وب مشکل است و در گذشته اغلب باعث سردرد شده است. اما خوشبختانه آن روزها به پایان رسیده است.


باورش سخت است: در سال 2024 اکنون می توان با یک خط CSS به نتیجه دلخواه رسید.:

0f1273b25d9806459716

0f1273b25d9806459716

در گذشته، مردم از گزینه های مختلف دیگری برای رسیدن به نتیجه مشابه استفاده می کردند:

فلکس باکس

0f1273b25d9806459716

موقعیت یابی مطلق

0f1273b25d9806459716

بلوک درون خطی

0f1273b25d9806459716

را پشتیبانی مرورگر برای align-content اکنون بسیار خوب است و دیگر استدلال خوبی برای استفاده از تکنیک های قدیمی وجود ندارد. از جمله، دیگر نیازی به Flexbox برای این کار ندارید و عنصر فرزند لازم نیست در یک عنصر جداگانه باشد (برخلاف مثال بالا). div شامل شود. شگفت‌انگیز است که پس از چندین دهه پیشرفت، CSS تنها اکنون دارای یک ویژگی واحد برای کنترل مرکزگذاری عمودی است.

بازگشت