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

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

عبدالله ابو حميد

السؤال

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

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

 

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

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

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

Recommended Posts

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

الـ parent هو

 

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

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

 

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

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

 

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

  • 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
بتاريخ 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

 

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

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

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

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

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

×   لقد أضفت محتوى بخط أو تنسيق مختلف.   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.

  • إعلانات

  • تابعنا على



×
×
  • أضف...