• 0

كيف أجعل عنصر داخلي child فوق العنصر الأب؟

السلام عليكم،

قمت بعمل تأثير تظليل وتدرج على صورة الـ header ويوجد بداخل الـ Div الذي طبقت عليه هذا التأثير Div آخر يحمل نص h3 لكن ظهر النص تحت هذا التأثير، كل ما أريده أن أجعل النص يظهر فوق التأثير بحيث يصبح مقروء بشكل كامل.

 

هذا هو الموقع لتوضيح الصورة:

https://alobailancpa.com/7/index.php

انشر على الشّبكات الاجتماعية


رابط هذه المساهمة
  • 1
بتاريخ 1 دقيقة مضت قال عبدالله التميمي5:

الـ parent هو

 

الهيدر اصبح عنصر وليس parent

الparent اللي فيه الكلاس row اضف له الخاصيه position: relative 

 

والآدي ده carouselExampleSlidesOnly# اضف له الخاصيه 

position: absolute والخاصيه bottom: 50px

 

1 شخص أعجب بهذا

انشر على الشّبكات الاجتماعية


رابط هذه المساهمة
  • 0

العنصر اللي تم اضافه التأثير ليه اجعله في نفس المستوي او مستوي اعلي وليس parent واضف له الخاصيه position absolute

واستخدم الخاصيه z-index بقيمه سالبه في حال تم اضافه العنصر بعد الparent

انشر على الشّبكات الاجتماعية


رابط هذه المساهمة
  • 0

حاولت مراراً وللأسف لم أصل إلى نتيجة، هل بإمكانك أن تضع يدك على موضع الخلل وتخبرني ما هو الكود المفترض بالتحديد؟ شكراً لك

انشر على الشّبكات الاجتماعية


رابط هذه المساهمة
  • 0

ممتاز! الآن اتضحت الصورة بارك الله فيك، لكن أصبح النص وكأنه يسبح خارج محيطه ((خصوصاً في العبارات التي تكون على سطرين)) ، في السابق كان النص لا يستطيع أن يخرج عن الـ header ، الآن لو شاهدت الموقع ستفهم المقصود.

تمّ تعديل بواسطة عبدالله التميمي5

انشر على الشّبكات الاجتماعية


رابط هذه المساهمة
  • 0

السلام عليكم

بتاريخ On 27‏/3‏/2020 at 22:02 قال عبدالله التميمي5:

أصبح النص وكأنه يسبح خارج محيطه ((خصوصاً في العبارات التي تكون على سطرين)) ، في السابق كان النص لا يستطيع أن يخرج عن الـ header ، الآن لو شاهدت الموقع ستفهم المقصود.

لو ركزت في خواص الcss في الرابط وبالتحديد في الخاصيه position ستجد حل المشكله

 

انشر على الشّبكات الاجتماعية


رابط هذه المساهمة
  • 0
بتاريخ 20 ساعات قال Hamada Sayed:

السلام عليكم

لو ركزت في خواص الcss في الرابط وبالتحديد في الخاصيه position ستجد حل المشكله

 

وعليكم السلام ورحمة الله وبركاته، لم ينجح الأمر معي حتى الآن :( قمت بتحديث الموقع وعدلت وجربت خاصية position ولا زال النص غير ثابت، ويختلف من شاشة لأخرى، طبعاً هذه المشكلة ظهرت بعد حل المشكلة الأصلية.

انشر على الشّبكات الاجتماعية


رابط هذه المساهمة
  • 0

الparent للheader أضف له الخاصيه position: relative والchild التاني اللي بعد الheader أضف له الخاصيه position: absolute والخاصيه bottom: 50px

 

انشر على الشّبكات الاجتماعية


رابط هذه المساهمة
  • 0
بتاريخ On 4/2/2020 at 13:04 قال Hamada Sayed:

الparent للheader أضف له الخاصيه position: relative والchild التاني اللي بعد الheader أضف له الخاصيه position: absolute والخاصيه bottom: 50px

 

لن يتأثر، لأن الـ parent أصبح لا يحتوي على شيء بداخله الآن

الـ parent هو

<div class="col-lg-12 order-lg-24 mb-8 about-header"></div>

والـ Child هو

<div id="carouselExampleSlidesOnly" class="carousel slide" data-ride="carousel" style="bottom: 50px;">
...
</div>

... << أقصد بها بداخله جميع العناصر والنصوص.

 

لو قمت بعمل inspect على متصفح chrome ستفهم قصدي :)

تمّ تعديل بواسطة عبدالله التميمي5

انشر على الشّبكات الاجتماعية


رابط هذه المساهمة
  • 0
بتاريخ منذ ساعة مضت قال Hamada Sayed:

 

الهيدر اصبح عنصر وليس parent

الparent اللي فيه الكلاس row اضف له الخاصيه position: relative 

 

والآدي ده carouselExampleSlidesOnly# اضف له الخاصيه 

position: absolute والخاصيه bottom: 50px

 

شكراً جزيلاً، تعمل الآن، بارك الله فيك

انشر على الشّبكات الاجتماعية


رابط هذه المساهمة

يجب أن تكون عضوًا لدينا لتتمكّن من التعليق

انشاء حساب جديد

يستغرق التسجيل بضع ثوان فقط


سجّل حسابًا جديدًا

تسجيل الدخول

تملك حسابا مسجّلا بالفعل؟


سجّل دخولك الآن