Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • November 26, 2018 at 5:34 am #1037521
    alsonjonsolutions

    Hi,
    I have a formatting issue on my website which i would like to adjust. I would like to reduce the padding at the top and bottom of the footer.

    Because my footer is a sticky footer, I need as little padding at the top and bottom.
    I’m currently using the following codes but the gap still seems to be too big.

    #footer { padding-top: 0; padding-bottom: 0; }

    @media only screen and (min-width: 1024px) {
    #footer {
    position: fixed;
    width: 100%;
    bottom: 0;
    z-index: 10000;
    }}

    November 26, 2018 at 11:18 am #1037605
    Nikko

    Hey alsonjonsolutions,

    Try adding this css code:

    #top #footer .widget {
    margin: 0;
}

    Hope it helps.

    Best regards,
    Nikko

    November 26, 2018 at 11:46 am #1037618
    alsonjonsolutions

    Sorry i cleared my cache and now the margin is much smaller, however, the bottom portion of the footer is still relatively large. Is there a way to completely remove that.

    November 27, 2018 at 12:20 pm #1037972
    alsonjonsolutions

    Anyone else can help with regards to this?

    November 27, 2018 at 1:23 pm #1037978
    Yigit

    Hi,

    Please try adding this code to the Quick CSS section under Enfold > General Styling or to your child theme’s style.css file:

    CSS Snippet:

    
#footer {
    padding-bottom: 5px;
}

    Best regards,
    Yigit

    November 27, 2018 at 5:41 pm #1038091
    alsonjonsolutions

    Hi Yigit,

    Thanks for the reply.

    Currently im using the following codes.

    this is for the sticky footer and for it to only show up on desktops
    @media only screen and (min-width: 1024px) {
    #footer {
    position: fixed;
    width: 100%;
    bottom: 0;
    z-index: 10000;
    }}

    earlier codes i used to try remove the margin
    #top #footer .widget {
    margin: 0;
    }

    the current code you mentioned.
    #footer {
    padding-bottom: 5px;
    }

    I tried all the codes but it still remains the same.

    i have uploaded the screenshot in the link below

    https://paste.pics/4bb30599c84b1e690810695d015b8630

    November 28, 2018 at 3:21 pm #1038550
    Nikko

    Hi alsonjonsolutions,

    Can you try to remove top padding as well on Yigit’s code, so it should look like:

    #footer {
    padding-bottom: 5px;
    padding-top: 0;
}

    Then add this css code as well:

    #footer .widget p {
    margin-bottom: 0;
}

    Best regards,
    Nikko

    December 10, 2018 at 1:06 pm #1043026
    alsonjonsolutions

    It Works! Thanks!

  • Author
    Posts
Viewing 8 posts - 1 through 8 (of 8 total)
  • The topic ‘Footer padding’ is closed to new replies.