I want to make only this part of my footer white, can someone help me please? Thanks.
Topic summary
Main issue: the merchant wants only the upper section of the footer to be white.
Key steps:
- A helper requested the store URL; the merchant provided it.
- CSS was added to the end of base.css to style the top footer section: set .footer padding-top to 0 (important) and make .footer__content-top white with padding-top of 42px.
Follow-up and adjustment:
- After applying, on very large screens the white area didn’t span as intended.
- A media query for wide displays was suggested: at min-width 1700px, set .footer__content-top to max-width: 100% to ensure full-width appearance.
Outcome:
- The merchant confirmed the fix worked and expressed thanks. No further issues reported.
Notes:
- Screenshots were shared to illustrate before/after, but the core solution is the CSS change and the large-screen media query.
- CSS (Cascading Style Sheets) controls visual styling; a media query applies styles only above a specified screen width.
Status: Resolved.
@gbastore - can you please share the page link?
@gbastore - add this css to the very end of your base.css file and check
.footer{padding-top: 0 !important;}
.footer__content-top{background-color: #fff; padding-top: 42px;}
@suyash1 - My footer looks like this now:
@gbastore - I tihnk you are using bigger screen device, add this code too and check
@media screen and (min-width:1700px){
.footer__content-top{max-width: 100%;}
}
1 Like
Thank you so much @suyash1 , you are the best.
1 Like
@gbastore - welcome, glad to help.