How to shrink a block without wasting space?

Question

Bootstrap

The .fixed-bottom class presses a block (a block literally one line high) down the browser window, BUT if the height of the displayed one begins to exceed the height of the browser window, then it goes beyond the pressed block (for example, if the site is on the entire window and one line is written at the bottom, then it is overlapped by the pinned box), is it possible to pin the box down so that its top border is the bottom border of the browser window?

That is, the point is that when scrolling, the site footer is displayed completely ABOVE the pressed block, and not partially behind it.

Answer 1

set the bottom margin of the footer equal to the height of the pressed block

Answer 2

use stycky

.some-class {
position: sticky;
bottom: 0;
}