Как прижать footer не работает метод css?

Question

[wanderbit]

html,
body {
  height: 100% !important;
}
.page {
  position: relative !important;
  min-height: 100% !important;
}
.main {
  padding-bottom: 50px !important;
}
.footer {
  position: absolute !important;
  left: 0 !important;
  bottom: 0 !important;
  width: 100% !important;
  height: 40px !important;
}

ggpatl.by/english/%D0%BF%D0%BE%D0%B2%D1%81%D0%B5%D...

Answer 1

[max0ua]

Есль много способов прижимать. Для вашего нужно внимательность с селекторами

#page {
	position: relative !important;
	min-height: 100% !important;
}
main {
	padding-bottom: 50px !important;
}
footer {
	position: absolute !important;
	left: 0 !important;
	bottom: 0 !important;
	width: 100% !important;
	height: 40px !important;
}

Вместо селектора footer можно использовать #footer, или оба

Answer 2

[Егор Огурцов]

А почему position: absolute, если там position: fixed должно быть?

Comments

[wanderbit]

я хочу чтобы футер не был все время виден как меню а был внизу страницы когда контента мало

Answer 3

[wanderbit]

сделал так

html,
body {
height: 100% !important;
}

.container {
position: relative !important;
min-height: 100% !important;
}
main {
padding-bottom: 50px !important;
}

#footer {
position: absolute !important;
left: 0 !important;
bottom: 0 !important;
width: 100% !important;
height: 55px !important;
}

футер теперь внизу,но к контейнеру не применяется свойство min-height: 100%

Comments

[wanderbit]

еще появилась проблема при открытии спойлера футер не меняет своего положения и оказывается по центру страницы