Hello, I am trying to troubleshoot a problem with our CMS. When we make the blogs featured blogs the pictures are not showing up on mobile on the home page and also on the blog page. The margins are super wide and are prohibiting the picture from showing. There is also a margin error in the text as well. I have no idea why this is happening because they all look like they are there correctly.
@Sales_AnimalBiome - Welcome to the forums.
I am not seeing that. Here I selected featured items = on.
The blog page is using newest. No filter set. Images present.
Can you share a screen cap? I don’t know what you are looking at.
Again it really helps us help you if you can share an example.
When you are having issues on the front end (published site) please share the link to it. I was able to locate it though deduction.
The issue is being caused by the process that makes images responsive, which is controlled by webflow.
Technical -> img.blog-post-image
sizes="(max-width: 479px) 2px, 1vw" is resizing the image to 14px x 11px and other similarly small sizes on smaller breakpoints.
Cause: I suspect this is due to the use of all or many of the css size attributes you have used on the img.blog-post-image in the designer and the responsive generation process being confused by competing attributes.
Suggestion. Set img.blog-post-image to display:block, remove the unnecessary size attributes, publish and test.
I did remove the size attributes to auto but it only made the pictures smaller. I can’t find the css setting you showed displayed above. Can you re-explain how to fix this problem?
That code was generated by Webflow’s responsive image process on publish. Not something you can control.
Need the webflow team to chime in on what is causing this.
Hi @Sales_AnimalBiome Welcome to the community
I did some debugging and found the solution:
post-preview-image-link element to
Try this and let me know how it goes
I think that worked, thanks so much!