Footer And Bottom At The End Of Screen For Short Articles - Question | JoomShaper

Footer And Bottom At The End Of Screen For Short Articles

PK

Peter Klinke

Helix Framework 3 years ago

I have created a wbesite with pagebuilder and helix ultimate.

The page includes some short joomla articles where bottom and footer are places in the middle of the screen. Isn't ist possible to place them at the end of screen but only for short articles?

0
14 Answers
Pavel
Pavel
Accepted Answer
3 years ago #84098

Hi Peter.

You have a meaningless code in two places that interferes with the work of the code that I provided.

Remove it and everything will work

Inline code

Code in custom.css

Or, if for some reason you want to keep your code (I repeat - this code is meaningless), replace in my code

from

#sp-main-body {
    margin-bottom: auto;
}

to

#sp-main-body + * {
    margin-top: auto;
}
0
Paul Frankowski
Paul Frankowski
Accepted Answer
Senior Staff 3 years ago #83273

Hi Peter,

there are few methods to solve it, but before I present one of them, remember that Google recommend that a single article should include at least 600 words!. Of course you can use less 400-500, but .... if you care about SEO, decide.

One of method (easy one) is set min-height for article content, yes - custom CSS method:

.view-article .article-details {
  min-height: 750px;}
0
Mehtaz Afsana Borsha
Mehtaz Afsana Borsha
Accepted Answer
Support Agent 3 years ago #83274

Hi

Thanks for contacting us. You can follow Pauls instructions. Thanks Paul for sharing the solution with us.

-Regards.

0
PK
Peter Klinke
Accepted Answer
3 years ago #84026

Thank you for quick response, but this simple solution is no solution.

It does not consider several screen sizes and types and the size of bottom and footer.

Sincerely Peter

0
Pavel
Pavel
Accepted Answer
3 years ago #84027

Hi Peter.

Try this

.body-innerwrapper {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}
#sp-main-body {
    margin-bottom: auto;
}
0
PK
Peter Klinke
Accepted Answer
3 years ago #84031

Hi Pavel,

I tried your code but it does not do anything :-(

0
Pavel
Pavel
Accepted Answer
3 years ago #84032

I tried your code but it does not do anything

It cannot be. But I can't see your site to check

0
S
SPD
Accepted Answer
3 years ago #84041

Pavel, Wanted to thank you for that code, as I have been searching for a consistent solution for awhile now and that worked perfectly so far with minimum testing. Cheers and thanks for sharing!

0
Pavel
Pavel
Accepted Answer
3 years ago #84053

Hi @SPD. You are wellcome

0
PK
Peter Klinke
Accepted Answer
3 years ago #84063

is there something more to do than adding tocustom code

0
Pavel
Pavel
Accepted Answer
3 years ago #84064

Hi. Nothing more. Your site is under password. I can’t say anymore without seeing your site. I am not an employee of support. Open the site for public access and I can look

0
PK
Peter Klinke
Accepted Answer
3 years ago #84068

Hi Pavel,

thanks for quick response. I have added a temporarily user. An example page is menu item Über uns/Tast

Thank you again in advance.

0
PK
Peter Klinke
Accepted Answer
3 years ago #84259

Hi Pavel,

I didn't find where the inline code comes from but this code '#sp-main-body + * {...' seems to work fine.

Cheers and lots of thanx!!

Peter

1
Pavel
Pavel
Accepted Answer
3 years ago #84327

You are wellcome

0