خاصية position :fixed في css

في الحقيقة العنصر الثاني لا يختفي ولكن يرتفع للأعلى ويصبح أسفل العنصر الأول تماما بحيث لا يظهر وللتاكد من هذا الامر يمكنك اعطاء العنصر الاول الخاصية display وقيمتها none وسوف يظهر العنصر الثاني , عند استخدام القيمة fixed نحتاج الى ضبط تموضع العنصر من خلال الخاصيات top , right , left , bottom كالتالي

        .div1{
            background-color: #ff0;
            position: fixed;
            top: 0;
            left: 0;
        }

يمكنك التحكم في القيم فبدلا من 0 يمكنك وضع أي رقم , وهذا الرقم يدل على بعد العنصر عن الشاشة من الاتجاه المحدد , فمثلا لو وضعت قيمة top ب 0 فذلك يعني ان العنصر سوف يبتعد عن اعلى الشاشة بمقدار 0 وهذا يعني أنه سوف يلتصق بأعلى الشاشة , ثم يمكننا اعطاء العنصر الثاني خاصية margin كالتالي

        .div2{
            margin-top: 100px;

        }

وبهذا سو يظهر العنصر الثاني أسفل العنصر الاول 

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