Cant get custom or OOB footer to stay at the bottom of portal (sticky)

[Corbett Croslin]

I've tried so many different things to get the footer to stay at the bottom but there appears to be a conflict I can't find using the browser inspect tool. I've tried position absolute/relative on the elements html, body, main, footer, and a bunch of classes and ID's. Even when switched with OOB footer and header the footer was not on the bottom. I don't have any css in portal, themes, or css/js include.

[Harold Benitez · Accepted solution]

Hi @Corbett Croslin,

I'm not sure if you already got this resolved but this is what I use to make the portal sections display properly especially the footer section when you want it to appear at the bottom without making it sticky.

In your portal theme, create a new CSS include and add the following:

/** Portal Page Section and Footer Fix **/

section.page {
display: flex;
flex-direction: column;
display: -ms-flexbox;
-ms-flex-direction: column;
}

section.page > main.body,
section.page > section.body {
flex-grow: 1;
flex-shrink: 0;
-ms-flex-positive: 1;
}

[Corbett Croslin]

Thank  you. Yes this turned out to be a solution.

https://serviceportal.io/creating-sticky-footer-service-portal/

[JamesAcevedo88]

This solution worked for me but is not working for all pages. For example the standar_ticket page and the customer_order_details pages. I still get white space at the bottom

[Servicenow12342]

Hi, try with this
In Page,

main{
height:100vh;
}