Пишу для себя, чтоб не забыть. Вечно вылетает из головы, как правильно прижать подвал к низу страницы 😉 На самом деле все просто. Создаем структуру html примерно такого вида:
1 | <div class="wrap"> |
2 | |
3 | Какой-то текст |
4 | |
5 | </div> |
6 |
7 | <footer class="footer"> |
8 | подвал |
9 | </footer> |
после добавляем css код:
1 | * { |
2 | margin: 0; |
3 | } |
4 | html, body { |
5 | height: 100%; |
6 | } |
7 | .wrap { |
8 | min-height: 100%; |
9 | /* отступ равен высоте подвала */ |
10 | margin-bottom: -142px; |
11 | } |
12 | .wrap:after { |
13 | content: ""; |
14 | display: block; |
15 | } |
16 | .footer, .wrap:after { |
17 | /* высота подвала */ |
18 | height: 142px; |
19 | } |
20 | .footer { |
21 | background: #000; |
22 | } |