اذهب إلى المحتوى
  • 0

مشكلة بتوسيط العناصر في foundation

Ahmed Gad4

السؤال

السلام عليكم ورحمة الله وبركاته

عندي مشكلة في كود

اقتباس

<div class="row">

بتابع شروحات تعليم لغة html

ولكن الكود دا بيقوم بتوسيط الاكواد داخل الصفحة

ولكن عندما اضيفه لا تتاثر الصفحة نهائيا

علما باني استخدم برنامج براكيت

وفي الصورة شكل الكود وتطبيقها عندي

1.jpg

2.jpg

رابط هذا التعليق
شارك على الشبكات الإجتماعية

Recommended Posts

  • 1
بتاريخ 4 دقائق مضت قال Ahmed Gad4:

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

كوضع افتراضي بدون كود css مساعد 

صديقي هذا لأنك قمت بإستخدام الكلاس float-left و التي تقوم بجعل المحتوى يظهر على اليسار و كذلك قمت بإستخدام الكلاس float-right و التي تقوم بوضع المحتوى على اليمين قم بإستبدالهما بfloat-center في كلا الحاوتين , كما أنه في المثال المرفق قام بإعطاء الحاوية div إثنى عشر عمودا على مختلف الشاشات بينما أنت قمت بتقسيم صفحتك إلي قسمين حاوية تحتل 8 أعمدة و أخرى تحتل 3 أعتقد بأنك بحاجة لدراسة و فهم نظام الgrid و الأدوات المساعدة في إيطار foundation.

بالتوفيق.

رابط هذا التعليق
شارك على الشبكات الإجتماعية

  • 0

و عليكم السلام أحمد..

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

رابط هذا التعليق
شارك على الشبكات الإجتماعية

  • 0

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

كوضع افتراضي بدون كود css مساعد 

 

8888.jpg

77777.jpg

رابط هذا التعليق
شارك على الشبكات الإجتماعية

  • 0

شكرا اخي علي مجهودك,

ولكن كل الشرح اللي بلاقيه بيكون زي نظام نسخ ولصق
والحل الاكيد هو ان لازم اروح مكان متخصص للدراسة افضل

بتاريخ 14 دقائق مضت قال Nezar Madi:

صديقي هذا لأنك قمت بإستخدام الكلاس float-left و التي تقوم بجعل المحتوى يظهر على اليسار و كذلك قمت بإستخدام الكلاس float-right و التي تقوم بوضع المحتوى على اليمين قم بإستبدالهما بfloat-center في كلا الحاوتين , كما أنه في المثال المرفق قام بإعطاء الحاوية div إثنى عشر عمودا على مختلف الشاشات بينما أنت قمت بتقسيم صفحتك إلي قسمين حاوية تحتل 8 أعمدة و أخرى تحتل 3 أعتقد بأنك بحاجة لدراسة و فهم نظام الgrid و الأدوات المساعدة في إيطار foundation.

بالتوفيق.

لما قمت بحذف كافة الاكواد وتركت الكود الرئيسي
مازالت المشكلة قائمة

4444.jpg

5555.jpg

رابط هذا التعليق
شارك على الشبكات الإجتماعية

  • 0
بتاريخ 9 دقائق مضت قال Ahmed Gad4:

لما قمت بحذف كافة الاكواد وتركت الكود الرئيسي
مازالت المشكلة قائمة

هذا لأنك قمت بحذف الحاوية التي تحتوي على تنسيقات الأعمدة columns large-12 small-12 medium-12 , نظام الgrid يقسم الصفحة إلي أعمدة و صفوف  لعمل صف نقوم بإستخدام row و لعمل عمود نقوم بإستخدام columns و من ثم تحديد العنصر كم سيحتل عمود من الصف علما بأن كل صف مقسم إلي 12 عمود و بإمكانك أيضا جعل عنصر ما يحتل أعمدة مختلفة بإختلاف حجم الشاشة مثلا في شاشات الهواتف الذكية يمكن جعل العنصر يحتل 12 عمود و ذلك بكتابة small-12 و عى شاشات اللابتوب نريده أن يحتل 9 أعمدة medium-9 و على الشاشات الكبيرة مثلا نريده أن يحتل فقط 6 أعمدة large-6.

رابط هذا التعليق
شارك على الشبكات الإجتماعية

  • 0
بتاريخ 24 دقائق مضت قال Nezar Madi:

هذا لأنك قمت بحذف الحاوية التي تحتوي على تنسيقات الأعمدة columns large-12 small-12 medium-12 , نظام الgrid يقسم الصفحة إلي أعمدة و صفوف  لعمل صف نقوم بإستخدام row و لعمل عمود نقوم بإستخدام columns و من ثم تحديد العنصر كم سيحتل عمود من الصف علما بأن كل صف مقسم إلي 12 عمود و بإمكانك أيضا جعل عنصر ما يحتل أعمدة مختلفة بإختلاف حجم الشاشة مثلا في شاشات الهواتف الذكية يمكن جعل العنصر يحتل 12 عمود و ذلك بكتابة small-12 و عى شاشات اللابتوب نريده أن يحتل 9 أعمدة medium-9 و على الشاشات الكبيرة مثلا نريده أن يحتل فقط 6 أعمدة large-6.

تمام فهمت كده شكرا لك اخي

رابط هذا التعليق
شارك على الشبكات الإجتماعية

انضم إلى النقاش

يمكنك أن تنشر الآن وتسجل لاحقًا. إذا كان لديك حساب، فسجل الدخول الآن لتنشر باسم حسابك.

زائر
أجب على هذا السؤال...

×   لقد أضفت محتوى بخط أو تنسيق مختلف.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   جرى استعادة المحتوى السابق..   امسح المحرر

×   You cannot paste images directly. Upload or insert images from URL.

  • إعلانات

  • تابعنا على



×
×
  • أضف...