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

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


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

0f1273b25d9806459716

0f1273b25d9806459716

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

فلکس باکس

0f1273b25d9806459716

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

0f1273b25d9806459716

بلوک درون خطی

0f1273b25d9806459716

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

بازگشت