حل شده

کار نکردن position sticky

بازدید164پست ها1آخرین فعالیت1 سال پیش
0
0

سلام کسی میدونه چرا position sticky کار نمیکنه؟

.container {
  min-height: 300vh;
}
.nav-selections {
  text-transform: uppercase;
  display: inline-block;
  text-decoration: none;
  color: white;
  padding: 18px;
  float: right;
  margin-left: 50px;
  transition: 1.5s;
}

.nav-selections:hover{
  transition: 1.5s;
  color: black;
}

ul {
  background-color: #B79b58;
  overflow: auto;
}

li {
  list-style-type: none;
}
<main class="container">
  <nav style="position: sticky; position: -webkit-sticky;">
    <ul align="left">
      <li><a href="#/contact" class="nav-selections" style="margin-right:35px;">Contact</a></li>
      <li><a href="#/about" class="nav-selections">درباره</a></li>
      <li><a href="#/products" class="nav-selections">محصولات</a></li>
      <li><a href="#" class="nav-selections">خانه</a></li>
    </ul>
  </nav>
</main>
آخرین ویرایش: 23-02-2023 ???? 23:12، توسط رضا رمضانپور

1 پاسخ

1

درود
یکی از علت هاش میتونه این باشه که یکی از والد های این بلوک overflow داره. چک کنید هیچکدونش نباید overflow داشته باشه وگرنه کار نمیکنه.
یا برای والد این بلوک که میخواین sticky باشه overflow: initial ست کنید.

سوال برنامه نویسی دارید؟

ندونستن عیب نیست، نپرسیدن چرا!

خوش آمدید

برای طرح سوال، ایجاد بحث و فعالیت در سایت نیاز است ابتدا وارد حساب کاربری خود شوید. در صورتی که هنوز عضو سایت نیستید میتوانید در عرض تنها چند ثانیه ثبت نام کنید.