Hola
si los elementos superiores tienen alturas fijas, podrias hacerlo con css.
No se como lo tienes montado pero seria algo asi.
Código CSS:
Ver originalhtml, body{
position: relative;
overflow: hidden;
width: 100%;
height: 100%;
margin: 0px;
}
#wrapper{
position: relative;
height: 100%;
overflow: auto;
background-color: yellow;
}
header, main{
height: 50px;
}
footer {
background: #1a1a1a;
display: block;
padding: 65px 45px 45px 45px;
box-sizing: border-box;
/*En esta funcion hay que restarle al 100% la altura del resto de elementos y margenes, en este caso solo son los dos elementos superiores de 50px*/
height: calc(100% - 50px - 50px);
}
.logo2 {
width: 30%;
background-image: url('../images/logo-2.png');
background-position: center center;
background-repeat: no-repeat;
}
footer > p {
width: 70%;
margin: 0px;
font-family: 'Arial';
font-size: 21px;
color: white;
}
Si pruebas esto en un archivo deberia funcionar.
Saludos.