Jump to content

Resizing blog post thumbnail blocks

Recommended Posts

Posted

Site URL: https://www.planetsuj.com/

Hi,

I've been having some trouble resizing blog post thumbnails. While the site looks perfectly fine on mobile, the pictures are enormous when on desktop. I've been trying in vain to resize them using CSS but I keep ending up chopping off, squeezing or resizing the image but with the clickable area still large.

I've tried using code such as this which resized the image but it also aligned left, with the clickable area much larger than the image:

.blog-single-column .blog-single-column--container.is-loaded {
    max-width: 720px; 
}

Also the code below only adjusts width, again with a large clickable area:

@media screen and (min-width: 640px) 
{ img { 
      max-width:720px;
} 
}

I might be missing something but is there a way to resize the image containers (as well as the images) for blog thumbnails while viewing on desktop?

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.