image spacing

Solved
Highlighted
New Member
7 0 0

on my home page i have a list of collections and the titles of the collections are being cut off or are cutting into the image vertically, this also happens on my all products page, any help?

0 Likes
Highlighted

Hello @pilateskatt,

Can you please share your site url

Want to modify or incorporate custom changes on store, Hire us
If helpful then please Like and Accept Solution .
Email: pallavi@oscprofessionals.com
Skype : oscprofessionals-87
Whats app
Free Website Review and advice for sale from Shopify Conversion Experts | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | Shopify SEO ; Digital Marketing & amp | Site Speed Optimization | Performance Site Audit
0 Likes
Highlighted
New Member
7 0 0
Hi!
here's the link
https://pilateskatt.com/
I fixed the issue for desktop but I can't seem to fix it on the mobile
version of the site. Thanks in advance for your help!
0 Likes
Highlighted
New Member
7 0 0

Hi!
here's the link

I fixed the issue for desktop but I can't seem to fix it on the mobile version of the site. Thanks in advance for your help!
0 Likes
Highlighted

This is an accepted solution.

@pilateskatt,

Add this css at the bottom of

Online Store->Theme->Edit code->Assets->theme.scss.liquid

@media only screen and (max-width: 749px) {
.collection-grid-item {
    margin-bottom: 35px;
}
.collection-grid-item__title.h3 {
    position: relative;
}
}
Want to modify or incorporate custom changes on store, Hire us
If helpful then please Like and Accept Solution .
Email: pallavi@oscprofessionals.com
Skype : oscprofessionals-87
Whats app
Free Website Review and advice for sale from Shopify Conversion Experts | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | Shopify SEO ; Digital Marketing & amp | Site Speed Optimization | Performance Site Audit
0 Likes
Highlighted
New Member
7 0 0

actually I haven't fixed it on desktop either 

0 Likes
Highlighted
New Member
7 0 0

Ok that worked perfectly for the desktop version but on mobile the text is still on the image and not in the margin/padding

0 Likes
Highlighted

This is an accepted solution.

@pilateskatt,

Please add below css

@media only screen and (max-width: 749px) {
.collection-grid-item__title.h3 {
    transform: translate(4px, 5px);
    font-size: 16px;
}
}
Want to modify or incorporate custom changes on store, Hire us
If helpful then please Like and Accept Solution .
Email: pallavi@oscprofessionals.com
Skype : oscprofessionals-87
Whats app
Free Website Review and advice for sale from Shopify Conversion Experts | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | Shopify SEO ; Digital Marketing & amp | Site Speed Optimization | Performance Site Audit
0 Likes
Highlighted
New Member
7 0 0

You are an absolute legend!!! Thank you so much!!!!!!

0 Likes
Highlighted
New Member
7 0 0

Hello again! I'm having the same problem with the text on my home page, could you send me code that did the same thing for my collection page? Thank you in advance

0 Likes