putting footer to bottom of page

DEAUXTECH
Shopify Partner
53 0 0

Hello all, 

 

I have a footer bar that I am aiming to force to the bottom of the page. On pages with lots of content this is fine, but on pages with very little content it sits half way up the page. I have tried setting the body to 100vh but thats makes pages with very little content larger than the screen size forcing you to scroll to the footer which is unnecessary. 

 

Any help appreciated! Thanks. 

0 Likes
mijankarim
Shopify Partner
53 13 15

Hi,

You can set page content div to a minimum height which can be 70vh .

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store? hire me.
Email: mijan.karim@yahoo.com
Skype: mijan.karim
If you want to donate me click here (paypal)
0 Likes
DEAUXTECH
Shopify Partner
53 0 0

Hi,

 

I tried this, 70vh is not tall enough and the footer still sits halfway up the page when set to this height. Thanks.

0 Likes
mijankarim
Shopify Partner
53 13 15

You can try to fixed footer at bottom by using css something like this .

 

.footer {
  position: fixed;
  left: 0;
  bottom: 0;
  width: 100%;
}
If helpful then please Like and Accept Solution.
Want to modify or custom changes on store? hire me.
Email: mijan.karim@yahoo.com
Skype: mijan.karim
If you want to donate me click here (paypal)
0 Likes
DEAUXTECH
Shopify Partner
53 0 0

Hello, 

 

I have tried this also & unfortunately doesn't work. 

0 Likes
mijankarim
Shopify Partner
53 13 15

Can you give page link which is shorter ?

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store? hire me.
Email: mijan.karim@yahoo.com
Skype: mijan.karim
If you want to donate me click here (paypal)
0 Likes
DEAUXTECH
Shopify Partner
53 0 0

Sure, I have added it below.

https://nfjfn2ykkvbal7p3-3748626467.shopifypreview.com

 

Please go to the login page, you will see a page that has short content. Thanks.

0 Likes
mijankarim
Shopify Partner
53 13 15

Which page has little content ?

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store? hire me.
Email: mijan.karim@yahoo.com
Skype: mijan.karim
If you want to donate me click here (paypal)
0 Likes
DEAUXTECH
Shopify Partner
53 0 0

The login page, apologies, I thought I had added the page too.

0 Likes
mijankarim
Shopify Partner
53 13 15

This css should work .

 

footer{
position:fixed;
width:100%;
bottom:0;
}

It will fixed footer in bottom.

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store? hire me.
Email: mijan.karim@yahoo.com
Skype: mijan.karim
If you want to donate me click here (paypal)
0 Likes