Viewing 16 posts - 1 through 16 (of 16 total)
  • Author
    Posts
  • #761505

    Hello,
    We have a website with limited content. So our pages are short.
    Is it possible to force the footer to the bottom of the screen when the page is short.
    Sometimes white space becomes visible after the footer because of the short pages.

    #761534

    Hey Wolf,

    You can try to add a “Color Section” to the layout. Then use the “Section Minimum Height” option: http://www.clipular.com/c/6248100729454592.png?k=uv9y0eTazC1ex3LFe6HcMsFLH14 to set a minimum height for the content section. This height will be applied regardless of the content height. If the page is an archive page (i.e. shop page or post) you can’t set a minimum height for the content. In this case you either need to add more content or the footer/socket area will be bigger.
    Best regards,
    Jordan Shannon

    #761783

    is it possible to force the contect of a color section to the top because now it centers in the middle.

    #761785

    Hi!

    Please provide us a URL of the site, so we can take a look and try help you out with it.

    Thanks a lot

    Cheers!
    Basilis

    #761910

    link in the private content

    #761932

    Hi,

    Can you include admin credentials as well?

    Best regards,
    Jordan Shannon

    #761936

    in the private content

    #762089

    I added the following to quick css:

    .template-page.content.av-content-full.alpha.units{
    vertical-align: top !important;
    }

    It seems to have fixed the the content so it is no longer in the middle. Let me know if this is what you needed.

    Best regards,
    Jordan Shannon

    #762130

    Hi,

    To force your footer to the bottom of the screen, add these custom CSS codes at Enfold Theme options > General Styling > Quick CSS

    
    
    #top {
        position: relative;
        min-height: 100%;
    }
    
    #footer {
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
    }
    

    To affect a specific page, replace the #top id for an exclusive body class that each page has. -> check here: http://prntscr.com/ekrt8r

    Let me know if it works :)

    Best regards,
    John Torvik

    • This reply was modified 7 years, 9 months ago by John Torvik.
    #762415

    This breaks the pages, the footer gets placed very very high on the page.

    #762416

    Jordan Shannon’s work seems to have solved it at least on the homepage, I will test and get back to you

    #762422

    Hi,

    Great! Please let us know if run into further issues.

    Best regards,
    Jordan Shannon

    #762439

    When I have the content-section for the image set to 25%
    and the content seciton for the text to 75% to footer gets pushed down to far. The footer doesn’t start under the fold but a bit further down.
    Is it possible to get the footer to start right after the fold. (on pages that don’t have enought content to fill the screen)

    #762547

    Hi,

    Using the color section solution the container height will be applied regardless of the content height.For the pages that push the footer to far beyond the fold, you can try and set a custom height for color section.

    Best regards,
    Jordan Shannon

    #1342136

    hi there,

    we also had this problem. we fixed it globally with this css:

    #main.all_colors {
    display: flex;
    flex-flow: column wrap;
    justify-content: space-between;
    min-height: 100vh;
    }

    #1342141

    Hi,
    Thank you for sharing your solution, if you have any further questions please create a new thread and we will gladly try to help you. Thank you for using Enfold.

    Best regards,
    Mike

Viewing 16 posts - 1 through 16 (of 16 total)
  • The topic ‘force footer to the bottom of the screen’ is closed to new replies.