Why aren't my product thumbnails visible on my website?

Store Design

Topic summary

A user experienced an issue where product thumbnails disappeared from their website, though full images remained visible on individual product pages. The problem affected both mobile and desktop views.

Initial Solution:

  • Another user provided a CSS fix to add to the base.css file
  • After refinement, the code card__media, .card .media {position: initial !important;} successfully restored the thumbnails

Recurring Problem:

  • The issue reappeared later when the user made additional website updates (not involving base.css)
  • Root cause identified: unclosed brackets “}”
  • Missing closing brackets on lines 2882 and 2985 in base.css caused the CSS to break

Resolution:

  • User restored an earlier version of their theme file
  • Acknowledged need to avoid manual code modifications to prevent similar issues

The discussion demonstrates a common CSS syntax error that can break styling, with the solution involving both immediate fixes and version control practices.

Summarized with AI on November 25. AI used: claude-sonnet-4-5-20250929.
1

Hi everyone, I have the weirdest issue.. I was updating my website, and I noticed that all of the sudden - my product thumbnails are not showing up. When you click on the listing, the photo is there. It’s happening on mobile and desktop.

I was NOT in my code or doing anything except in the regular editor, adding content, but nothing to do with products so I have NO IDEA how this happened???

Does anyone have a clue???

Thank you for your time

www.westmichiganballoons.com

Screenshot 2022-10-21 153240.jpg
Screenshot 2022-10-21 153240.jpg1253×422 19.7 KB

2

@lisahiggins - please add this css to the very end of your base.css file and check

.card .media {position: initial !important;}
3

@lisahiggins

suyash1_0-1666417547082.png
suyash1_0-1666417547082.png1366×768 191 KB

4

This didn’t work, unfortunately, how did you get the images to show up in your other comment?? Please help if you can thank you

5

@lisahiggins - please replace old line with this line and it should work

.card__media, .card .media {position: initial !important;}
1 Like
6

THAT WORKED!! I appreciate you so much. I spent a long time trying to figure this out. THANK YOU THANK YOU

1 Like
7

@lisahiggins - welcome, do let me know if you need any more updates, you have my email below.

1 Like
8

Ok so I’m updating my website and this happened again!! I wasn’t in my base.css I don’t know why it would just change. Any ideas on how to get my thumbnails back again?? Thank you for your time

https://westmichiganballoons.com/collections/all

9

@lisahiggins - multiple closing brackets “}” are not closed hence the issue, please add closing brackets “}” on line 2882 and 2895 in base.css file

10

Thank you! I was able to go back and undo some changes and save an earlier version of my theme file.. ugh I just need to stop messing with code HA thanks for your help. again!