Помогите прижать футер

Пробовал таким способом - cssdeck.com/labs/fegxpkxq Не получилось. У меня есть доступ только к css, нужный файл шаблона php или html не нашел.
В Битриксе вот такой футер:

<div class="footer-core">
  <div class="footer-one">
   <div class="footer">
    <div class="menu-copy">
        <!-- Контент футера-->
   </div>
  </div>
 </div> 
</div>

Код неудачной попытки такой:

html {
    position: relative;
    min-height: 100%;
}
body {
    margin: 0 0 222px; /* 222px = footer height */
}
.footer-core { /*.footer-one, .footer */
    position: absolute;
    left: 0;
    bottom: 0;
    height: 222px;
    width: 100%;
}

Помогите с ним справиться.

Ссылка не стала нормально на пример: http://cssdeck.com/labs/fegxpkxq

Советую поиграться с этим ресурсом :wink:
Сам когда-то познал прижатие футера тут =)

2 лайка

У меня основная проблема в том, что я не сначала страницу верстаю, а нужно уже в имеющемся css что-то изменить. Так-то вариантов много в сети.
За сервис спасибо, поклацаю.

Там надо родителям высоту минимальную в 100% прописать.
футеру отрицательный верхний маргин, а контентной части нижний паддинг, вроде на этом основывается. и подобрать можно.

1 лайк

На этом ресурсе понятно, за счет чего прижимается футер. Но зачем указывать relative? Все ведь работает и без него, в чем смысл?

А можно по аналогу прижать шапку, но определённую? То есть когда страница прокручивается ниже, то появляется прижатая шапка

@J_Derp, Это уже решается с помощью JS :smile:

Можно так, через CSS:
для хедера:
position:fixed;
height:фиксированная высота;
z-index:1000;

для контентной части:
margin-top:на высоту хедера;

Но это без отслеживания, изменения формы хедера.

Footer fix :slightly_smiling:

1 лайк