Как зафиксировать сайдбар, но что-бы при скролле страницы в конце он не перекрыл футер?

Question

[Nikita Shchypylov]

Доброй ночи
У меня есть довольной большой сайдбар (700px в высоту). Я дал ему position: fixed;, всё неплохо, но в конце при скроле он налазит на футер, вот так :

Как это можно побороть?

Answer 1

[Exploding]

Какие еще 700рх? Вы раньше что-нибудь верстали (не только для себя)?

при скролле страницы

Каким образом скролл страницы может влиять на fixed сайдбар?

Скрин Ваш из разряда "Пазл на 1500 элементов"!

UPD:
----------------------------------
Если z-index не помогает... А если и помогает, всеравно:
1. Вынесите сайдбар в body
2. Установите в relative
3. Установите нужный z-index
4. Установите html, body: height:100%;
5. Установите сайдбару высоту 100%. Если 100% много - тогда: calc(100% - 50px); (50px - для примера)
6. Радуйтесь.

P.S. Для имитации оверлея можете добавить сайдбару в открытом состоянии еще:
box-shadow: rgba(0, 0, 0, 0.8) 0px 0px 0px 2600px;

Answer 2

[Андрей Токмаков]

stickyjs.com
Вместо тысячи fixed

Answer 3

[hellaim_sunlane]

Пропиши z-index сайдбару больше чем футеру. Например футеру z-index: 5; а сайдбару z-index: 10; Число конкретно роли не играет главное чтоб оно было больше у сайдбара.