Как установить позицию нижнего колонтитула абсолютный или относительный в зависимости от размера контента?

Я хочу сделать что-то вроде этого: enter image description here

В случае 1: высота контента меньше окна. В случае 2: ​​Высота контента больше, чем окно - и выставка прокрутки,

Моя проблема заключается в том, что контент динамически изменяется. Итак, иногда .Cont высота больше, чем высота окна. А потом, .foot должен быть под .cont.

Если я установил этот код

<html>
<head>
<style type="text/css">
.cont{
    margin:0 auto;
    background-color:#333;
    width:800px;
    height:500px;
}
.foot {
    position:absolute;
    left:50%;
    margin:0 0 0 -400px;
    background-color:#F33;
    width:800px;
    height:20px;
    bottom:0px;
}
</style>
</head>
<body>
    <div class="cont"></div>
    <div class="foot"></div>
</body>
</html>

, я получаю это: enter image description here

5
задан TylerH 11 September 2019 в 13:48
поделиться