I currently have 3 columns in my footer for desktop which is fine - but need this reduce to 1 coloumn for mobile and tablet. What's the best way to do this?
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: 999px) and (min-width: 690px) {
#footer-widgets .container .col.span_4 {
width: 100% !important;
}
}
div.widget h2 {
line-height: 1.5em !important;
}
I currently have 3 columns in my footer for desktop which is fine - but need this reduce to 1 coloumn for mobile and tablet. What's the best way to do this?
Hi There,
The phone is already having one column from my end:
Please try this css for tablet
Thanks.
Hi Judith,
it seems not to work properly on tablet and as you can see the contact number overlaps on mobile. Is there a way to fix it?
Hey Again,
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):
Thanks
ThemeNectar Support Team
thank you that worked.