Jump to content

Image Overlap format problems

Recommended Posts

Site URL: https://onthegrow.squarespace.com/

Hi, 

In editing mode my image overlap format looks as the attached first image. However once I click out of edit mode and view as published, the result is much less 'overlapped' like the 2nd image attached. Is there an easy fix for this? I seem to have this problem across all my squarespace sites with this block. 

You can find the image overlap in question near the bottom of the 'about' page. 

Site password: OTG123

Thank you in advance! 

Meet the driving force (example right).png

Meet the driving force (example wrong).png

Link to comment

Try adding to Design > Custom CSS

/* about image overlap */
@media screen and (min-width:992px) {
div#block-yui_3_17_2_1_1641591668426_33572 figcaption.image-card-wrapper {
    margin-left: -10%;
}
}

 

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment
  • 2 months later...

You used a padding-bottom: 20px code on mobile. IT caused problem.

Add this to Design > Custom CSS to override it

/* Image text problem mobile */
@media screen and (max-width:767px) {
.image-title h1 {
    padding-bottom: 0 !important;
}
}

 

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.