Footer not showing on mobile view

[GenP]

Hi there,

I just realized that the footer is not showing on the mobile view.

Website: lagotacirco.com

Attached screenshot:

Thanks in advance,

Yara

[lely]

Hi Yara,

Footer content is there. Elements in the footer are white in color. Then there’s this CSS that adds black background color on it on desktop view:

x-navbar-inner, .x-colophon.top, .x-colophon.bottom {
    background-color: #000000;
}

If it is not intended to add footer black background on desktop only, that means you have syntax error. See this: https://screencast-o-matic.com/watch/cqjjhFOLjO

I found out you have the following CSS on your homepage > Custom CSS:

    @media(min-width:980px) {
    .home .masthead {
        position: absolute;
        width: 100%;
    }
    .home .x-navbar {
        background-color: #000000;
        border-bottom: 0;
        box-shadow: none;
    }
    x-navbar-inner,
    .x-colophon.top,
    .x-colophon.bottom {
        background-color: #000000;
    }

Closing tag for above media query is missing. Please make sure that all open { have corresponding closing } tag.

Hope this helps.

[GenP]

Lely! you are just awesome
Love this community. You guys have been super helpful and patient especially with people like me who are new to website building.

[GenP]

Spoke too early. I have followed everything you did and it did change in edit mode but when I refresh the website on my mobile, it still gives me white color. Not sure what the problem is?

[nabeel]

Hi @GenP,

I checked your page and the closing bracket is still missing, go to your homepage CSS section and replace your code with the following:

@media screen and (min-width: 980px) {
    .home .masthead {
        position: absolute;
        width: 100%;
    }
    .home .x-navbar {
        background-color: #000000;
        border-bottom: 0;
        box-shadow: none;
    }
}
.x-navbar-inner,
.x-colophon.top,
.x-colophon.bottom {
   background-color: #000 !important;
}

Don’t forget to clear all caches including your device browser’s cache after adding the code. Let us know how this goes!