Как сделать корзину фиксированной на свитке без использования позиции

#javascript #css

Вопрос:

У меня есть правильная корзина col-md-4, которую я хотел бы исправить при прокрутке до нижнего колонтитула страницы без потери полей, размера и т. Д…

Если я использую классическое положение: исправлено, оно будет расположено на видовом экране, и я потеряю свою структуру…

Есть ли какой-нибудь способ сделать это ?

Вот изображение дизайна

Вот что происходит с фиксированным сценарием

Ответ №1:

Я думаю, что «позиция: липкая» вам поможет.

 <div class="row">
  <div class="col-8 bg-light" style="height: 1200px;">lorem ipsum for custom height</div>
  <div class="col-4">
    <div class="sticky">sticky block</div>
  </div>
</div>
 

(используется css начальной загрузки)
и css:

 .sticky {
  position: sticky;
  top: 0;
  padding: 10px;
  background-color: #ddd;
}
 

жить https://jsfiddle.net/kfbypsdx/