Shopify themes, liquid, logos, and UX
This is probably a case where a picture makes more sense than descriptions alone, so to start off with:
As you might notice in the picture, the Lift Shadow is now working (that was a chore all by itself) and I got my Rounded Corners, so that's great. However the Shadow doesn't actually fall behind the images, it's sort of next to them, leaving ugly little white corners in both right-side corners. I'm hoping someone might be able to help me fill in this gap. Any assistance is greatly appreciated.
Here is the code I am using so far
/* MULTICOLUMN */
/* Rounded Corners */
.multicolumn-card .media>img {border-radius: 10px;}
/* Lift Shadow */
.multicolumn-card__image-wrapper.multicolumn-card__image-wrapper--full-width.multicolumn-card-spacing {
box-shadow: 3px 3px 5px #adadad; /* set your values */}
Theme: Dawn
Site: https://darklingnails.com/
Password: darkling
Solved! Go to the solution
This is an accepted solution.
Hey @hellodarkling
Follow these Steps:
1) Go to Online Store
2) Edit Code
3) Find theme.liquid file
4) Add the following code in the bottom of the file above </body> tag
<style>
.multicolumn-card-spacing {
border-radius: 10px !important;
margin: 0 !important;
}
</style>
RESULT:
If I managed to help you then, don't forget to Like it and Mark it as Solution!
Best Regards,
Moeed
Hi @hellodarkling
Do you want like this? Please let me know. If the problem is not solved yet. You can add me as a collaborator, I will fix it from your dashboard.
Thank you very much, but I am really looking to keep the shadow to the right and bottom, to match the shadows on my Featured Collection items.
That being said, if I could please know how you adjusted the spacing between the columns, that's another stumbling block I've been struggling with.
This is an accepted solution.
Hey @hellodarkling
Follow these Steps:
1) Go to Online Store
2) Edit Code
3) Find theme.liquid file
4) Add the following code in the bottom of the file above </body> tag
<style>
.multicolumn-card-spacing {
border-radius: 10px !important;
margin: 0 !important;
}
</style>
RESULT:
If I managed to help you then, don't forget to Like it and Mark it as Solution!
Best Regards,
Moeed
Perfect! Thank you so much @Moeed ❤️
Thank you for your reply. I'm glad to hear that the solution worked well for you. If you require any more help, please don't hesitate to reach out. If you find this information useful, a Like would be greatly appreciated.
Shopify and our financial partners regularly review and update verification requiremen...
By Jacqui Mar 14, 2025Unlock the potential of marketing on your business growth with Shopify Academy's late...
By Shopify Mar 12, 2025Learn how to increase conversion rates in every stage of the customer journey by enroll...
By Shopify Mar 5, 2025