Blog image appears weird

Keren222
New Member
5 0 0

Hello,

I am adding my blog URL.

For some reason the images appear bigger than they really are, that is leading for a gray blank between them. 

I also added a screenshot.

 

All the images are the same size.

Does anyone know what the problem is and what is the best size for the cover image for a blog post in debut theme?

Captur5472e.JPG

Thank you

 

0 Likes
LuckyNigam
Excursionist
34 2 6

Hi @Keren222 

Give me your website url So I'll check whats the issue and give a better solution for you.

 

Thanks

0 Likes
Keren222
New Member
5 0 0
0 Likes
Scott-Marshall
Excursionist
36 3 3

Hi @KE,

I'm not seeing any issues on my end, therefore, it looks like you may have found a solution. As for the recommended size, I'd recommend 600 x 600px for a three-column layout.

Let me know if you need any help in the future!

Cheers,

0 Likes
Keren222
New Member
5 0 0

Thank you.

I fixed it on the desktop but there is still a problem with the mobile display,

Can you take a look at the mobile screen?

 

 

 

0 Likes
Scott-Marshall
Excursionist
36 3 3

Hi @Keren222,

You can head into the "theme.css" file and remove the following code found on line 3913:

.article__link:not([disabled]):hover .article__grid-image-wrapper::before, .article__link:focus .article__grid-image-wrapper::before {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-color: var(--color-image-overlay);
    opacity: var(--opacity-image-overlay);
    z-index: 1; 
}
0 Likes
Keren222
New Member
5 0 0

Thank you for your time but that is not my intention. I don't want to delete the hover option, I just want the hover to fit the image.

is there a way to do it?

 

 

0 Likes
Scott-Marshall
Excursionist
36 3 3

Hi @Keren222,

It's certainly possible, however, you'd need to refactor quite a few elements based on how the blog page in the Debut theme has been structured.

Cheers,

0 Likes