Grids look fine in preview but NOT when loading the actual site

Hi!

I'm about to pull out my hair. I'm attempting to fix a grid that just won't post properly (my mini bio hasn't been posting as a grid at all) and I'm editing another to make it have less columns (removing 2 place holder images from the top and leaving 3) and when I edit it, it looks FINE in the edit screen, I go to look at a preview in a new tab and it looks perfect but when I update it, open another browser window and go to my site directly it does NOT look good. HALP please!

Here's how it looks in the preview and what I'm trying to accomplish:
https://www.dropbox.com/s/un1w8qpratpnmm7/Screen%20Shot%202023-01-14%20at%2011.48.59%20AM.png?dl=0

Here's how it actually look once I "update" and load the page in a separate tab:
https://www.dropbox.com/s/07o6r47zff6orlw/Screen%20Shot%202023-01-14%20at%2011.49.33%20AM.png?dl=0

I have cleared my cookies in both Safari and Chrome and it hasn't helped. I've tried adding the grids to the same container. I've tried doing a separate container for each grid, which is now preferred since I want the circular images to be in the smaller container width so the images are closer together, I've tried changing the padding and margins and nothing seems to work.