sadr0b0t
commented
7 years ago Исчерпывающий обзор по прижиманию футера к подвалу страницы - 4 способа. Проблема в том, что этот подвал не видно при наличии вертикальной прокрутки (для веб-страницы это ок, но не для статус-бара окна приложения).
Как с помощью CSS прижать footer к низу окна браузера http://dimox.name/press_footer_bottom_with_css
Чел задается ровно этим же вопросом, но внятного ответа не получил keeping div aligned to bottom of window on page scroll https://bytes.com/topic/html-css/answers/462071-keeping-div-aligned-bottom-window-page-scroll
получает ответ https://groups.google.com/forum/?hl=en#!topic/alt.html/RlBDk6-KHUY
- The best technical solution is to position the copyright at the bottom of the viewport and give it a top margin large enough to satisfy your eye. Something like:
HTML:
<div class="copyright">
<p>Images, HTML, and CSS Copyright 2006 by Ramesh</p>
</div>CSS:
div.copyright { position: relative ;/* Establish 'positioned' ancestor */
text-align: center ; /* Center the contained text */
}
div.copyright p {
color: black ; /* Must specify colors */
background-color: white ; /* otherwise transparent! */
position: fixed ; /* position relative to window */
bottom: 0 ; /* against the window bottom */
left: 0 ; /* Stretch to go clear */
right: 0 ; /* across viewport */
margin-bottom: 0 ; /* Adjust to suit */
padding-top: 20px ; /* with a nice top padding */
}Всего-то нужно было указать position: fixed вместо absolute, все работает отлично.
Нужен нормальный лэйаут-менеджер, голый HTML+CSS уже запарили.
Нужно
Колонки еще можно худо-бедно сделать на CSS.
Со статус-баром начинаются приключения(никаких приключений - position: fixed и всё). Простой способ на CSSЕсли контент умещается в окно, то все норм - полоска прижата. Если же появляется вертикальный скролл, то полоска улетает наверх вместе с прокруткой.
Еще есть вариант сделать так, чтобы полоска была всегда внизу контента (стандартный футер на сайте), но он тоже не подходит, т.к. на экранах с прокруткой статус-бара просто не будет видно.