0 Пользователей и 1 Гость просматривают эту тему.
  • 5 Ответов
  • 2149 Просмотров
*

bekaaktau

  • Осваиваюсь на форуме
  • 16
  • 0 / 0
Фиксированный Footer/Подвал
« : 11.12.2014, 04:22:34 »
Привет всем. Знаю, что этот вопрос заезженный и в инете полным-полно статей. Но я так и не разобрался, кучу методов перепробовал прежде чем сюда писать. Шаблон делаю с нуля, footer уходит вниз. На главной странице отредактировал позицию модуля, в остальных страницах меню footer не зафиксирован, также модуль получился так, что половину страницы занимает. Контента пока что особого нет, разрабатывается Сам сайт . А это частичка кода CSS
Код
/* ---------------- Подвал/Footer ----------- */
div.footer {
  margin-top: 42.7em;
  margin-left: -2.1em;
  padding-left: 31em;
}
Помогите пожалуйста с этим footer-om.
*

Shustry

  • Moderator
  • 6436
  • 743 / 3
Re: Фиксированный Footer/Подвал
« Ответ #1 : 11.12.2014, 04:35:10 »
Код: css
div.footer {
position:fixed;
bottom:0;
}
*

bekaaktau

  • Осваиваюсь на форуме
  • 16
  • 0 / 0
Re: Фиксированный Footer/Подвал
« Ответ #2 : 11.12.2014, 05:01:54 »
Код: css
div.footer {
position:fixed;
bottom:0;
}
При таком использовании footer плавает по всей странице. К тому же, я этот способ пробовал.
Нужно, чтобы подвалу было отведено определенное место, и расположилось внизу страницы (!important и чтоб не плавало/бегало/прыгало при перелистывании скролом) Есть способ с использованием этого кода
Код
html , body {
    height: 100%;
    margin: 0;
    padding: 0;
}
Но у меня не получается его реализовать, сотню раз уже перепробовал.
*

Shustry

  • Moderator
  • 6436
  • 743 / 3
Re: Фиксированный Footer/Подвал
« Ответ #3 : 11.12.2014, 05:39:02 »
Вы бы пример показали, как надо сделать.
*

adamasantares

  • Новичок
  • 4
  • 0 / 0
  • Недельная небритость
Re: Фиксированный Footer/Подвал
« Ответ #4 : 12.12.2014, 20:07:13 »
Возможно я не совсем правильно понял что именно нужно, но если речь о прижатом к низу футере, то я для себя придумал такой способ и давно его применяю.

Код
<!DOCTYPE html>
<html>
  <head>
    <title>Site</title>
    <style type="text/css">
HTML, body {
width: 100%;
height: 100%;
margin: 0;
padding: 0;
font-size: 18px;
}
.clear {
clear: both;
width: 100%;
height: 1px;
}
.wrap {
position: relative;
min-height: 100%;
width: 100%;
/* или можно указать фиксированную ширину так: */
/* width: 980px; */
/* margin: 0 auto; */
}
.footer-padding {
padding-bottom: 50px; /* высота футера */
}
header {
height: 200px; /* шапка */
color: #fff;
background-color: #99B2FF;
text-align: center;
line-height: 180px;
}
.left-sidebar {
float: left;
width: 200px; /* левая колонка в 200px */
}
.content {
margin-left: 205px;
}
footer {
position: absolute;
left: 0;
bottom: 0;
width: 100%;
height: 50px;
background-color: #222222;
color: #fff;
text-align: center;
line-height: 48px;
}
    </style>
  </head>
  <body>
    <div class="wrap">
      <div class="footer-padding">
         <header> шапка сайта </header>
         <div>
            <aside class="left-sidebar"> левая колонка </aside>
            <article class="content"> контент </article>
<div class="clear"></div>
         </div>
      </div>
      <footer>
        подвал
      </footer>
    </div>
  </body>
</html>
*

Shustry

  • Moderator
  • 6436
  • 743 / 3
Re: Фиксированный Footer/Подвал
« Ответ #5 : 12.12.2014, 20:48:00 »
adamasantares, да, это самый удобный способ. Я так же делаю уже много лет. Другое дело, что непонятно, что автору нужно. У него какбэ не прижатый, а фиксированный футер, что совсем другое.
Чтобы оставить сообщение,
Вам необходимо Войти или Зарегистрироваться