مشکل استیک منو در پروژه

فایل خدمت شما.
توی بخش html  و  css عبارت HERE رو جستجو کن. اونجا ها رو فقط تغییر دادم.

و برای درک تاثیر ارتفاع، ارتفاع body رو برگردون به حالت height: 100%

یه استایل border: 1px solid red بهش بده که محدوده اش برات مشخص باشه

و بعد اسکرول کن

میبینی که از همون جایی که بادی تموم میشه منوت هم اسکرول میشه و میره

سلام

آقا چند تا مشکل هست توی کدت

اولا، چرا به تگ body ارتفاع دادی؟

تگ بادی رو نباید ارتفاع بدی تا خود به خود با افزایش حجم کامپوننت ها اون هم ارتفاع خودش رو افزایش بده.

یا لااقل اگه میخوای ارتفاع بدی باید min-height: 100% بدی

دوما، استیکی شدن نسبیه

یه مثال بارزش همین سایت 7 لرن
دیدی توی بخش سرفصل ها، مثلا سر فصل آموزش sass منوی aside سمت راست که اطلاعات کلی دوره و نام استاد رو نشون میده با اسکرول به پایین تا یه جایی sticky عمل میکنه بعدش رها میشه؟
خب دلیلش چیه؟
چون کانتینر اون منوی aside ارتفاعش زیاده، ولی محتوی نه.
به محتوی اون حالت استیکی میدن و نسبت به کانیتنرش حالت استیکی پیدا میکنه. زمانی که کانتینرش کل ارتفاعش اسکرول میشه و خارج میشه از محدودش اونم دیگه حالت استیکی نداره.

در مثال شما، چون میخوای اون منو کلا بالا قرار بگیره، باید کل اون div.container رو حالت استیکی کنی و نه .row درونش رو. 

چرا؟ با توضیحاتی که دادم چون شما همش میخوای اون بالا بچسبه باید المانت رو نسبت به سند یا همون body خودمون استیکی کنی. (البته من اینطور فهمیدم و اینطوریم جواب داده واسم)

پس 1. ارتفاع رو از بادی بگیر یا min-width بده

2. .container اون بخشی که میخوای استیکی بشه رو position : sticky بده

مشکل برطرف میشه.

سوم، منو ای که گفتی توی همه ی حالات sticky میشه و منوط به sm نیست

برای اینکار باید توی مدیا کوئری مربوط به sm عبارت position: sticky رو قرار بدی

موفق باشی

من همین کار هایی ک گفتم رو انجام دادم و حل شد، شما هم انجام بده

لطفا فایلش رو ضمیمه کنید. من این کار ها رو کردم ولی درست نشد

ممنون میشم