CMS Development

SMushnick
Member

Image size for blog page sidebar

SOLVE

Hi, currently, the sizes of images on the blog sidebar are not all the same size (see screenshot attached). I have various different things but nothing seems to be working. Is there a specific code I need to enter into the template css? Please help!Screen Shot 2022-06-10 at 11.34.55 AM.png

0 Upvotes
1 Accepted solution
Indra
Solution
Guide | Elite Partner
Guide | Elite Partner

Image size for blog page sidebar

SOLVE

Hi @SMushnick,

 

If you want to force the image size you can use the css options aspect-ratio. This is fully supported for most browsers.

 

If you use aspect ratio, I recommend to use object-fit cover if it's an image (img) object.

 

So your css should be like this:

.featured-image{
  aspect-ratio: 16/9;
  object-fit: cover;
}

 


Vet Digital - The Growth Agency | HubSpot Solutions Partner Agency

Did my post solve your question? Help the community by marking it as a solution

View solution in original post

1 Reply 1
Indra
Solution
Guide | Elite Partner
Guide | Elite Partner

Image size for blog page sidebar

SOLVE

Hi @SMushnick,

 

If you want to force the image size you can use the css options aspect-ratio. This is fully supported for most browsers.

 

If you use aspect ratio, I recommend to use object-fit cover if it's an image (img) object.

 

So your css should be like this:

.featured-image{
  aspect-ratio: 16/9;
  object-fit: cover;
}

 


Vet Digital - The Growth Agency | HubSpot Solutions Partner Agency

Did my post solve your question? Help the community by marking it as a solution