1. I can't seem to see any images/logos on your footer. Could you share a screenshot of what you're seeing on your end? I only see one logo in your footer.
2. Add this into the Custom CSS box in your Salient Theme Options panel (We write all Custom CSS in the Live Browser to ensure accuracy. If you cannot see any changes, make sure there is no red cross in the Custom CSS Box as any syntax error would cause all CSS under that line of code to not show up on the Frontend):
@media only screen and (max-width:690px) {
.home a.nectar-button.n-sc-button.large.accent-color.regular-button {
min-width: 250px !important;
}
}
1. I have uploaded the logos/images. Want to make them horizontal on the left side and reduce the size to 50% if possible (similar to https://bpvltd.co.uk).
2. Thank you. On mobile, it works well now. Is it possible to do this for the desktop too, so permanent change with the same width across all the screens or it would overflow?
I have tweaked around and I have fixed most of the issues. I cannot find attribute div.col.span_6.
I would like to minimise the space between logos/images and copyrights as well as move the copyrights a bit to the right to make it just under the first logo on the left.
Have you tried using a global section to build this section of your footer. You can add the client display element to your global section. Here's our guide on setting up global sections. Here's a screenshot of the client display element.
In the meantime, you can use this CSS to reduce the spacing in the footer. Add this into the Custom CSS box in your Salient Theme Options panel:
@media only screen and (min-width: 1px) and (max-width: 999px) {
#footer-widgets .container .col {
margin-bottom: 10px;
}
}
Anyway, the second code does not work either, it does not change anything. I have cleared the cache too.
I cannot work around these global sections and the footer arrangement, it requires too long time, and the footer is almost ready, just need small tweaks to reduce the space only.
Could you please get back to me with the solution?
Add this into the Custom CSS box in your Salient Theme Options panel (We write all Custom CSS in the Live Browser to ensure accuracy. If you cannot see any changes, make sure there is no red cross in the Custom CSS Box as any syntax error would cause all CSS under that line of code to not show up on the Frontend):
Hi,
I want to align the images/logos at the footer on the left side, these need to be aligned horizontally next to each other.
It looks like these can be shown vertically only which does not look nice.
+++
I would like buttons on the homepage to have the same width despite a different text length and align them vertically on mobile.
"}
button, nectar_btn {
display: inline-block;
width: 260px; /* You can adjust the width value as needed */
}"
or this
"
.nectar-button.fixed-size { width: 300px; }"
Nothing works.
Hey Slaw,
Thank you for reaching out to us.
1. I can't seem to see any images/logos on your footer. Could you share a screenshot of what you're seeing on your end? I only see one logo in your footer.
2. Add this into the Custom CSS box in your Salient Theme Options panel (We write all Custom CSS in the Live Browser to ensure accuracy. If you cannot see any changes, make sure there is no red cross in the Custom CSS Box as any syntax error would cause all CSS under that line of code to not show up on the Frontend):
@media only screen and (max-width:690px) { .home a.nectar-button.n-sc-button.large.accent-color.regular-button { min-width: 250px !important; } }We look forward to your reply.
Thanks
Hi Andrew,
Thank you for your prompt reply.
1. I have uploaded the logos/images. Want to make them horizontal on the left side and reduce the size to 50% if possible (similar to https://bpvltd.co.uk).
2. Thank you. On mobile, it works well now. Is it possible to do this for the desktop too, so permanent change with the same width across all the screens or it would overflow?
Thanks, Slaw
Hello there,
Thank you for reaching out to us.
1. To arrange the logos horizontally, add this into the Custom CSS box in your Salient Theme Options panel:
#footer-widgets .span_6:nth-child(1) { display: flex; flex-direction: row; }2. Replace the previous CSS and let us know how that goes.
.home a.nectar-button.n-sc-button.large.accent-color.regular-button { min-width: 250px !important; }I hope that helps.
Thanks,
Hi Andrew,
1. I have put the below CSS there, and It does not look well and the logos are unbalanced, please see the screenshot.
Thanks.
Attached files: Screenshot_20230717144612.png
Hello slaw,
Thank you for getting back to us.
1. Try adding some padding to the images to create spacing between them. Add this into the Custom CSS box in your Salient Theme Options panel:
.widget.widget_block.widget_media_image { padding-left: 11px; }Try that and let us know how it goes.
Kind regards,
Hi Andrew,
Thank you.
I have tweaked around and I have fixed most of the issues. I cannot find attribute div.col.span_6.
I would like to minimise the space between logos/images and copyrights as well as move the copyrights a bit to the right to make it just under the first logo on the left.
Please see the screenshots attached.
Thanks!
Attached files: Screenshot 2023-07-18 122908.png
Screenshot_20230718122510.png
Hey Slaw,
Thank you for getting back to us.
Add this CSS and let us know how that goes.
body #footer-outer #copyright, .ascend #footer-outer #copyright { padding-top: 0 !important; } #footer-outer .row { padding-bottom: 0; }Kind regards,
Hi Andrew,
Thanks.
This has not corrected this issue.
Please see how much space is visible on the mobile.
Best regards,
Slaw
Attached files: Image_20230720102221.jpg
Hey Slaw,
Thank you for getting back to us.
Have you tried using a global section to build this section of your footer. You can add the client display element to your global section. Here's our guide on setting up global sections. Here's a screenshot of the client display element.
In the meantime, you can use this CSS to reduce the spacing in the footer. Add this into the Custom CSS box in your Salient Theme Options panel:
@media only screen and (min-width: 1px) and (max-width: 999px) { #footer-widgets .container .col { margin-bottom: 10px; } }Thanks
Hi Andrew,
This is a website built for us directly only.
Anyway, the second code does not work either, it does not change anything. I have cleared the cache too.
I cannot work around these global sections and the footer arrangement, it requires too long time, and the footer is almost ready, just need small tweaks to reduce the space only.
Could you please get back to me with the solution?
Best regards,
Slaw
Attached files: Screenshot_20230718122510.png
Image_20230720102221.jpg
Add this into the Custom CSS box in your Salient Theme Options panel (We write all Custom CSS in the Live Browser to ensure accuracy. If you cannot see any changes, make sure there is no red cross in the Custom CSS Box as any syntax error would cause all CSS under that line of code to not show up on the Frontend):
#footer-outer #copyright { padding-top: 0px; padding-bottom: 10px !important; } #footer-outer .row { padding-bottom: 0px !important; } #footer-outer .widget { margin-bottom: 0px; }Thanks
ThemeNectar Support Team