كيف اعرض الخط والخانات بشكل مرتب ؟

من الأفضل إرفاق مجلد المشروع بعد ضغطه لتفقد الكود وتوفير حل مناسب.

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

يمكنك تجريب كتابة الكود التالي :

body {
  direction: rtl;
}

input {
  direction: rtl;
  text-align: right;
  padding: 10px;
  border-radius: 5px;
  min-width: 280px;
  font-family: Arial, sans-serif; /* يمكنك استبدال Arial بالخط الذي ترغب في استخدامه */
}

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

بتاريخ 20 ساعة قال عمر قره محمد:

يمكنك تجريب كتابة الكود التالي :

body {
  direction: rtl;
}

input {
  direction: rtl;
  text-align: right;
  padding: 10px;
  border-radius: 5px;
  min-width: 280px;
  font-family: Arial, sans-serif; /* يمكنك استبدال Arial بالخط الذي ترغب في استخدامه */
}

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

هذا هو الكود 

بتاريخ 22 ساعة قال Mustafa Suleiman:

من الأفضل إرفاق مجلد المشروع بعد ضغطه لتفقد الكود وتوفير حل مناسب.

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

 

هذا الملف 🙏🏼

projects.zip

يمكنك التحكم بجهة العناصر وتنسيقها وترتيبها بواسطة عدة أوامر في ال CSS:

• أمر display: flex، ولتنسيق العناصر يمكنك تغيير قيمة ال justify content بما يناسبك.
• أمر display: grid، الذي يمكنك من أداء نفس الأمور الذي يتيحها لك ال flex ولكن بأوامر أخرى.
• أمر direction: rtl، الذي يسمح لك بتغيير جهة عرض العناصر الى الجهة من اليمين الى اليسار (عوضا عن من اليسار الى اليمن).

ملاحظة: يفضل ادراج كل عنصر في <div></div>، لأنه من النوع block، وهذا سيسهل عليك التنسيق أكثر بكثير.