htmlcss

Footer sitting above body elements

my website appearance

I have a picture of the website attached. The footer (logo, copyright, socials) keeps displaying above my body elements (the text + img). Is there something wrong with my CSS? The body text and img are under class .fronttest, which is shown in the image.

Footer CSS:

footer {
    position: static;
    bottom: 0;
    left: 7%;
    right: 7%;
}
Solution

  • I think that your problem is because position:static.

    When you use position :static the bottom ,left, and right properties are ignored.

    Try to change with this code.

    footer {
    position: fixed;
    bottom: 0;
    left: 7%;
    right: 7%;
}