Hi @kat,
If you look at the head of your page you are still loading in the bootstrap.css
With regards to the CSS. Questions for you - what does .gallery > img mean? Does it apply to your page set-up? What is the actual CSS that is applies to your img if you look in the DevTools?
Cheers,
Bob
No BST in mcgraphics.us/art except css in Head: <link href="../bootstrap_theme/bootstrap.css" rel="stylesheet" type="text/css">
<div class="gallery"> <div class="cat columns filter-item"> <img src="Images400/cat/chazPaint400x400.jpg" alt="Chaz, lovely orange cat"> </div>
In dev tools doesn’t seem to be there (I did take the arrow out this time)
`}
.gallery img {
object-fit: contain;
width: 100%;
max-height: 100%;
}`
I have some media queries above in the code for sale–content h3. Possible that interfering?
Hi @kat,
The link in the head that I show in my image above is loading the Bootstrap 5 theme styling onto your page.Typically the head is where the CSS is loaded and the footer is where the JavaScript (.js) files are loaded.
I looked at your page, and it seems like the images are all resizing correctly now. What problem are you trying to solve with the h3?
Cheers,
Bob
This really is nice.
And seems much better now, heading stays visible at bottom now better, but you can still catch out some oddities, just by grabbing a browser window corner and dragging it up and down varying dimensions.
As shown above.
Thats using the Brave Browser, Mac, etc.
nice though 
have a look see why some images are anomolous.
ok have fun
well, ok , quick dev tools shows that image there, the larger one is
is 434 x 436
while all the others around it are
434 x 300
tada ,
Why Hercule!
How did you do that?
Well… I am a Poirot after all!
Well ok ok… the CSS Grid tool helped a bit too…
and so the dimensions of that image varies as you change browser window dimensions and doesn’t seem to resize correctly
Still can’t figure this out. image is 400x400, same as all others. Maybe I should set the big dog image to Object-fit: contain
And can’t get the pricing table in the bottom .wrapper to center. Justify-content, justify-self doesn’t work.
Entertaining ; )
I think it might be that <h6 class=dog panel
bit.
just playing now
IM struggling in Dev tools so fireing up pinegrow now
have another Interesting view 
329.66 x 300
is the image dimensions for all the images in PG but
that…cough cough
Copper, Bernese Mountain dog
St Bernard?
is
327.66 x 327.66
yep delete that <h6 class = “dog panel” part and
PG then shows the image size the same as the others on the image mouse over in PG
delete that
h6 class = dog panel
part and
your good to go.
I think @RobM Rob mentioned something about that umpteen comments back?
Hi @kat,
I think @schpengle is right about the h6 throwing things off.
There are a couple of items with the pricing table. With flexbox you want to be careful with margins and max-width. Both are going to throw off any centering. I would set the wrapper to:
display: flex;
flex-wrap: wrap;
width: 100%;
align-items: center;
justify-content: center;
Then I would give the h2 a width of 100%. That should take care of centering everything.
Cheers,
Bob
Schpengle, you’re a genius; removing the h6 worked. Bermese Mountain dog—I thought it was a St. Bernard, too. Same size.
Adding display: flex to wrapper threw pricing table off until I added a div above the wrapper at the same level:<div><h2>How the Process Works</h2> Probably a more elegant way to do it.
So fun.
I want to add some animation to the menu, but think I need to switch to something else for a bit to quit torturing everyone. Thanks for sticking with me.
By the way, should I quite posting in Beginners? I do like it here.
LIkewise… I have no intention of ever leaving here…
Every days a school day … Even though Ive been playing truant for some time.
oh yeah.
so, of course, I simply had to Like your comment 
mmm just went back and searched, yep, h6 mentioned back there.
right im off, nighty night 
(well might sneak back later …)