Shopify themes, liquid, logos, and UX
Hey all,
Below I have attached an image of where I want to remove some padding, currently on my home page I have a little white section between the header and featured collection, I want to remove this so the header and featured collection pretty much have no area between them.
Thanks!
My website is RareSupply.co if you need it!
Solved! Go to the solution
This is an accepted solution.
Please Go to Online Store->Theme->Edit code then go to assets/base.css ->paste below code at the bottom of the file.
#shopify-section-template--14194862161981__featured_products.spaced-section {
margin-top: 0rem !important;
}
Thanks!
This is an accepted solution.
Please Go to Online Store->Theme->Edit code then go to assets/base.css ->paste below code at the bottom of the file.
@media screen and (min-width: 990px){
.header {
padding-top: 0.5rem;
padding-bottom: 0.5rem;
position: fixed !important;
width: 100% !important;
z-index: 100 !important;
background: #fff !important;
}
#MainContent{margin-top: 5rem;}
}
@media screen and (max-width: 989px) {
.header {
position: fixed !important;
width: 100% !important;
z-index: 100 !important;
background: #fff !important;
}
#MainContent{margin-top: 5rem;}
}
Thanks!
This is an accepted solution.
This is code customization work .
If helpful then please Like Solution
sorry for that issue can you please share us store url
This is an accepted solution.
Please Go to Online Store->Theme->Edit code then go to assets/base.css ->paste below code at the bottom of the file.
#shopify-section-template--14194862161981__featured_products.spaced-section {
margin-top: 0rem !important;
}
Thanks!
Thank you very much!
Are you also able to tell me how to make the heading sticky permanently?
Please share screenshot what do you want!
I want my header to stay at the top of the webpage permanently and not disappear when I scroll.
This is an accepted solution.
Please Go to Online Store->Theme->Edit code then go to assets/base.css ->paste below code at the bottom of the file.
@media screen and (min-width: 990px){
.header {
padding-top: 0.5rem;
padding-bottom: 0.5rem;
position: fixed !important;
width: 100% !important;
z-index: 100 !important;
background: #fff !important;
}
#MainContent{margin-top: 5rem;}
}
@media screen and (max-width: 989px) {
.header {
position: fixed !important;
width: 100% !important;
z-index: 100 !important;
background: #fff !important;
}
#MainContent{margin-top: 5rem;}
}
Thanks!
Thank you so much!
Now lastly is there a code that I can use to hide the product price once it’s sold out?
This is an accepted solution.
This is code customization work .
If helpful then please Like Solution
June brought summer energy to our community. Members jumped in with solutions, clicked ...
By JasonH Jun 5, 2025Learn how to build powerful custom workflows in Shopify Flow with expert guidance from ...
By Jacqui May 7, 2025Did You Know? May is named after Maia, the Roman goddess of growth and flourishing! ...
By JasonH May 2, 2025