Как достичь липкого поведения в CSS вверх или внизу ⇐ Javascript

[Anonymous]

На моем веб -сайте есть левая боковая панель, содержащая инструменты, связанные с отображаемым в настоящее время экраном. В настоящее время он не прилипает, поэтому, если вы хотите внести какие -либо изменения, вам нужно прокрутить всю дорогу. Поэтому я хотел бы достичь следующего поведения: < /p>

Если высота контейнера меньше экрана, он должен придерживаться верхней части. достигается с помощью чистого CSS или мне нужно привлечь какой -нибудь JavaScript? Я использую Tailwindcss, если это помогает.

Код: Выделить всё

Sidebar




Content





< /code>
Когда красный прямоугольник слева выше экрана, он должен прилипать к нижней части. Если он меньше экрана (адаптируйте с помощью класса H-*

CSS, например, H-20 ), то он должен придерживаться вершины. Обратите внимание, что в реалистичном сценарии высота динамически зависит от содержания боковой панели, которая меняется на страницу.

Подробнее здесь: https://stackoverflow.com/questions/795 ... the-bottom