Footer position

[Numb47]

How do i make so my footer doesnt do this;

It needs to go where arrows points. on the homepage it looks fine tho;

 

what do i need to add in there to make it work?

#ipsLayout_footer {
      margin: 0px;
      height: 201px;
    background: url({resource="footer.png" app="core" location="admin"});
      background-size: 100% 100%;
}

Thanks.

 

(yes ik, images look a bit scuffed, they're temporary. kind of, they will be adjusted)

[Ehren]

Hello,

It's a little difficult to provide a solution without seeing the live example, but something like this would work with the default HTML code:

@media (min-width: 980px){
	body{
		min-height: 100vh;
		display: flex;
		flex-direction: column;
	}

	body > *{
		flex: 0 0 auto;
	}

	#ipsLayout_body{
		flex: 1 1 auto;
	}
}

It hasn't been thoroughly tested though, so make sure to play around with it for a while to ensure there are no issues 🙂