Is it possible to avoid images to be stretched to the full width of the page?

[andreagrandi]

Hi,

I'm currently rebuilding my blog with Hugo and this template and I'm having an issue with images in posts. Basically every image is stretched to the full width of the page and if something doesn't have a large enough resolution, the image is stretched and appears all in low resolution.

I've tried to take a screenshot but I'm not sure if you can understand the issue:

as you can see the "Working Copy" screenshot looks so bad (it's an original screenshot taken from an iPad so it can't be as large as a screen).

Is it possible to avoid this behaviour? Is this a bug of the template?

Thanks

[rmdhnreza]

Options:

1. Overwrite render-image hook template.
2. Use <img src=""> tag instead ![image](link) in your markdown file.
3. Overwrite css

.article-content .gallery {
  margin-left: calc((var(--card-padding)) * 0);
  margin-right: calc((var(--card-padding)) * 0);
  width: calc(100% + var(--card-padding) * 0);
}

[andreagrandi]

Thanks, I will try one of these methods 🙏🏻

[rmdhnreza]

Or you can add shadow to your image (Like I using in my blog).