White Line in Footer

[lenchappell]

I have adjusted the footer in CSS in XTheme

.x-navbar {
border-bottom: 1px solid #ccc;
background-color: #215a84;
box-shadow: 0 0.15em 0.35em 0 rgba(0,0,0,0.135);
-webkit-transform: translate3d(0, 0, 0);
-ms-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
.x-colophon.top, .x-colophon.bottom {
border-top: 1px solid #e0e0e0;
border-top: 1px solid rgba(0,0,0,0.085);
background-color: #891414;
box-shadow: inset 0 1px 0 0 rgba(255,255,255,0.8);

}
.widget ul, .widget ol {
background-color: rgba(252, 252, 252, 0.65);
box-shadow: 0 1px 1px rgba(255,255,255,0.95);
}
.x-logobar {
background-image: url(“https://www.forcesonline.org.uk/wp-content/uploads/2022/01/headerbackground2.jpg”);
}

I am left with a white line which I suspect could be padding. I have tried everything. I did adjust the padding but then this caused the space between the Footer and images above to be squashed and the menu off centre to the right.

https://www.forcesonline.org.uk is the site

[prakash_s]

Hello @lenchappell,

Thanks for writing to us.

It seems that you have added a custom CSS code for border and box-shadow. I would suggest you set the color of the border and box-shadow the same or set it as none to get rid of the issue. I also noticed that you have added border-top multiple times.

Please replace the code with the given code.

.x-colophon.top, .x-colophon.bottom {
border-top: 1px solid rgb(137 20 20);
background-color: #891414;
box-shadow: inset 0 1px 0 0 rgb(137 20 20);
}

OR

.x-colophon.top, .x-colophon.bottom {
border-top: none;
background-color: #891414;
box-shadow: none;
}

The purpose of providing custom CSS is to show you how to add CSS code to your site. Writing custom CSS is outside the scope of our theme support. If you need more customization, you need to learn CSS and learn how to use the browser’s element inspector.In case if you have no idea about coding you can subscribe to One where customization questions are answered.

Hope it helps.
Thanks

[lenchappell]

@prakash_s

.x-colophon.top, .x-colophon.bottom {
border-top: 1px solid rgb(137 20 20);
background-color: #891414;
box-shadow: inset 0 1px 0 0 rgb(137 20 20);
}

Hi,
Thanks for the quick response. The first method worked fine.
Thanks for the fix, and the great theme.
Regards
Len

[tristup]

Hi Len,

Glad that we are able to help you.

Thanks