1

Добрый день, подскажите варианты прибитого к низу футера на странице без скролла, просто какие бывают варианты, а то пытался сделать абсолютным позиционированием и bottom 0; так выглядит не очень, а если прибиваю его вниз с помощью отрицательного маргина так появляется скролл, так что ищу решение как его можно прибить вниз и чтобы страница при этом не приобретала вертикальный скролл.

1 Answers1

1

$(document).ready(function(){
        $('main').addClass("clear");
});
*{
  margin:0;
  padding:0;
}
html,body{
  height:100%;
}
.clear{
  display:block;
  clear:both;
}
.clear:after{
  content:'';
  display:block;
  clear:both;
}
header,main,footer,aside,article{
  display:block;
}
header,main,footer{
  width:80%;
  margin:3px auto;
  background:#ccc;
}
header{
  min-height:120px;
}
main{
  background:none !important;
}
aside,article{
  float:left;
  box-sizing:border-box;
  -webkit-box-sizing:border-box;
}
aside{
  width:30%;
  min-height:200px;
  background:#ccc;
}
article{
  width:69.5%;
  min-height:240px;
  background:#ccc;
  margin-left:.5%;
}
footer{
  min-height:140px;
}
footer .copyright{
  text-align:center;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script>
<header> 
  шапка
</header>
<main> 
  <aside> левый блок</aside>
  <article> блок со статьями</article>
</main>
<footer> 
  <p class="copyright">копирайты и прочее</p>
</footer>

покажи мне пожалуйста где и в каком месте , footer вылазиает и/или залазиет куда то или находится не в низу ?

  • Вот дэмо на кодепен = http://codepen.io/anon/pen/eZwyOe –  May 20 '16 at 03:26