When zooming down, the footer rises

html { height: 100%; } body { background-color: #fbdb9e" padding-top: 65%; position: relative; padding-bottom: 150px; box-sizing: border-box; width: 1920px; height: 1080px; } .colortext { color: black; } .footer { background-color: #fbdb9e; border: 1px solid black; position: absolute; bottom: 0; height: 29px; width: 100%; clear: both; } .nax { position: absolute; padding-top: 15%; color: black; max-width: 100%; } nav { background-color: ; position: relative; } #header { position: absolute; z-index: 10000; } .img { height="250px"; width="400px"; } @media (min-width 420px) { img { max-width: 48% } } 

 <div class="site-wrapper"> <div class="cover-container"> <div id="header" class="masthead clearfix"> <div class="inner"> <nav class="nav nav-masthead"> <a class="nav-link " style=color:rgb(0,0,0) href="Cover Template for Bootstrap.html">Начальная страница</a> <a class="nav-link" style=color:rgb(0,0,0) href="История создания.html">История создания<br>&quot;Мертвые души&quot;</a> <a class="nav-link active" style=color:rgb(0,0,0) href="Краткий сюжет.html">Краткий сюжет</a> <a class="nav-link" style=color:rgb(0,0,0) href="Герои романа.html">Герои романа</a> <a class="nav-link" style=color:rgb(0,0,0) href="Галерея.html">Галерея</a> </nav> </div> <div class="nax"> <hr> <p align="left"> В маленький городок приезжает Павел Чичиков, мужчина среднего возраста с округлыми чертами лица. Поселившись в гостинице, Чичиков начинает расспрашивать трактирщика о городе и его обитателях. Позже он сам отправится с визитами к губернатору, чиновникам и помещикам. С каждым он ведёт себя вежливо и учтиво, сумев таким образом расположить к себе всех. О себе Чичиков рассказывает мало, на все вопросы отвечает уклончиво. </p> <p align="left"> Вскоре Чичиков отправляется в гости к помещику Манилову. Хозяин до приторности ласков и любезен с гостем. Чичиков признаётся, что желает выкупить умерших крестьян, чья смерть еще не прописана в бумагах. Убедив Манилова, он покупает мёртвые души и отправляется дальше. Вскоре он знакомится с Настасьей Коробочкой, бестолковой и пугливой старушкой. Мужчине удалось убедить помещицу продать ему души.Далее он посетил помещика Собакевича. Собакевич нисколько не встревожен сомнительным предложением Чичикова относительно продажи мёртвых душ и, торгуясь, продает ему их. </p> <p align="left"> Утром Чичиков в сопровождении Манилова идет в Палату заключить сделку. Дав взятки ответственным лицам, Павлу удаётся заверить куплю мертвых душ. </p> <p align="left"> По городку тем временем пошла молва об ушлом Чичикове. Поговаривали, что у него миллионы на счетах, девушки мечтают познакомиться с проворным дельцом. </p> <p align="left"> Губернатор устраивает бал, на которым собирается весь свет города. Чичикова буквально разрывают дамы, но он следит за дочерью губернатора, молодой юной девушкой, только что выпустившейся из института. Оставшиеся без его внимания дамы возмущены, а тут ещё вламывается пьяный Ноздрев, устроивший скандал. Чичиков поспешно удалился с приёма. Слухи постепенно обрастают новыми деталями и домыслами, и в конечном итоге весь городок обсуждает, как Чичиков угрозами и шантажом вынудил бедную Коробочку совершить невыгодную сделку. Другие судачили, что всё, чего хотел Чичиков – увести дочь губернатора. В это время становится известно о беглом разбойнике Копейкине, и горожане решили, что это и есть Чичиков. Кто-то высказывался даже, что Павел – это сам Наполеон. В домах перестают принимать Чичикова, так что ему пришлось покинуть город. Герой всеми способами и любыми доступными путями пытался сколотить себе состояние. До аферы с мёртвыми душами он служил на таможне, где беззастенчиво брал взятки от контрабандистов. Попав под следствие, он покинул губернию, оставшись ни с чем. </p> <hr> <img class="img" src="images/Heroes/img146.png" align="center" alt="Я хз почему не отображается" /> </div> </div> </div> </div> <footer> <div class="footer"> <center><a class="colortext" href="О нас.html">О нас</a></center> </div> </footer> <script src="./Cover Template for Bootstrap_files/jquery-3.1.1.slim.min.js.Без названия" integrity="sha384-A7FZj7v+d/sdmMqp/nOQwliLvUsJfDHW+k9Omg/a/EheAdgtzNs3hpfag6Ed950n" crossorigin="anonymous"></script> <script> window.jQuery || document.write('<script src="../../assets/js/vendor/jquery.min.js"><\/script>') </script> <script src="./Cover Template for Bootstrap_files/tether.min.js.Без названия" integrity="sha384-DztdAPBWPRXSA/3eYEEUWrWCy7G5KFbe8fFjk5JAIxUYHKkDx6Qin1DkWx51bBrb" crossorigin="anonymous"></script> <script src="./Cover Template for Bootstrap_files/bootstrap.min.js.Без названия"></script> <script src="./Cover Template for Bootstrap_files/ie10-viewport-bug-workaround.js.Без названия"> </script>