محاذاة DIVs أفقيًا

عند محاولة توسيط DIVs أفقيًا داخل حاوية DIV، قد تواجه مشكلات في المحاذاة. يمكن أن يحدث هذا لعدة أسباب. لتصحيح المشكلة، فكر في الحل التالي:

استخدم عرض الكتلة المضمنة بدلاً من Float

بدلاً من استخدام الخاصية float، فكر في استخدام العرض: inline- سمة الكتلة. سيضمن هذا عرض عناصر DIV كعناصر مضمّنة، مما يسمح بالمحاذاة الأفقية.

الكود المحدث

لتنفيذ هذا الحل، قم بتعديل كود CSS الخاص بك على النحو التالي:

.row {
  width: 100%;
  margin: 0 auto;
}
.block {
  width: 100px;
  display: inline-block;
}

سيعمل هذا التعديل على تصحيح مشكلة المحاذاة الأفقية، مما يتيح وضع عناصر DIV مركزيًا داخل الحاوية. تجدر الإشارة إلى أن هذا الأسلوب مناسب بشكل خاص للسيناريوهات التي يكون فيها عرض DIVs ثابتًا أو متشابهًا نسبيًا.