### Author:  [@RobM](https://forum.pinegrow.com/u/RobM)
#### Post date: [September 22, 2021, 5:39pm UTC](https://forum.pinegrow.com/t/css-grid-problems/5680/21 "2021-09-22T17:39:53Z")
Hi @kat,
If you look at the head of your page you are still loading in the bootstrap.css
If you look at the File menu under “Manage stylesheets…” you will likely see it still attached to your page.
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
---
### Author:  [@kat](https://forum.pinegrow.com/u/kat)
#### Post date: [September 22, 2021, 8:36pm UTC](https://forum.pinegrow.com/t/css-grid-problems/5680/22 "2021-09-22T20:36:26Z")
No BST in [mcgraphics.us/art](http://mcgraphics.us/art) except css in Head: ` `
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?
---
### Author:  [@RobM](https://forum.pinegrow.com/u/RobM)
#### Post date: [September 23, 2021, 9:34am UTC](https://forum.pinegrow.com/t/css-grid-problems/5680/23 "2021-09-23T09:34:38Z")
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
---
### Author:  [@schpengle](https://forum.pinegrow.com/u/schpengle)
#### Post date: [September 23, 2021, 6:42pm UTC](https://forum.pinegrow.com/t/css-grid-problems/5680/24 "2021-09-23T18:42:58Z")
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!
> **[Hercule Poirot](https://en.wikipedia.org/wiki/Hercule_Poirot)**
>
> Hercule Poirot (UK: /ˈɛərkjuːl ˈpwɑːroʊ/, US: /hɜːrˈkjuːl pwɑːˈroʊ/) is a fictional Belgian detective created by British writer Agatha Christie. Poirot is one of Christie's most famous and long-running characters, appearing in 33 novels, 2 plays (Black Coffee and Alibi), and more than 50 short stories published between 1920 and 1975.
> Poirot has been portrayed on radio, in film and on television by various actors, including Austin Trevor, John Moffatt, Albert Finney, Peter Ustinov, Ian Holm, To...
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
---
### Author:  [@kat](https://forum.pinegrow.com/u/kat)
#### Post date: [September 23, 2021, 7:17pm UTC](https://forum.pinegrow.com/t/css-grid-problems/5680/25 "2021-09-23T19:17:06Z")
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.
> [@schpengle](#):
>
> 434 x 436
> while all the others around it are 434 x 300
Entertaining ; )
---
### Author:  [@schpengle](https://forum.pinegrow.com/u/schpengle)
#### Post date: [September 23, 2021, 7:18pm UTC](https://forum.pinegrow.com/t/css-grid-problems/5680/26 "2021-09-23T19:18:01Z")
I think it might be that \
### Author:  [@schpengle](https://forum.pinegrow.com/u/schpengle)
#### Post date: [September 23, 2021, 7:26pm UTC](https://forum.pinegrow.com/t/css-grid-problems/5680/27 "2021-09-23T19:26:40Z")
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 \
### Author:  [@RobM](https://forum.pinegrow.com/u/RobM)
#### Post date: [September 23, 2021, 8:02pm UTC](https://forum.pinegrow.com/t/css-grid-problems/5680/28 "2021-09-23T20:02:16Z")
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:
```auto
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
---
### Author:  [@kat](https://forum.pinegrow.com/u/kat)
#### Post date: [September 23, 2021, 9:25pm UTC](https://forum.pinegrow.com/t/css-grid-problems/5680/29 "2021-09-23T21:25:01Z")
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:`How the Process Works
` 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.
---
### Author:  [@schpengle](https://forum.pinegrow.com/u/schpengle)
#### Post date: [September 23, 2021, 10:31pm UTC](https://forum.pinegrow.com/t/css-grid-problems/5680/30 "2021-09-23T22:31:14Z")
> [@kat](#):
>
> 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.
> [@kat](#):
>
> Schpengle, you’re a genius;
so, of course, I simply had to **Like** your comment 😃
---
### Author:  [@schpengle](https://forum.pinegrow.com/u/schpengle)
#### Post date: [September 23, 2021, 10:37pm UTC](https://forum.pinegrow.com/t/css-grid-problems/5680/31 "2021-09-23T22:37:28Z")
> [@RobM](#):
>
> In your case it wouldn’t work because you have wrapped each of your images in a `h6` element.
mmm just went back and searched, yep, h6 mentioned back there.
> [@Css grid problems](https://forum.pinegrow.com/t/css-grid-problems/5680/14):
>
> Hi @kat Not sure who “Maz” is or when this was used, but the child combinator \> is more strict than the descendent selector (a space). Basically, it just means only those images that have an element with a class of gallery as their direct parent. In your case it wouldn’t work because you have wrapped each of your images in a h6 element. The object-fit property needs the parent element to have a set-height. Right now, that is the h6.panel. Give this a height of 100%. Next, use object-fit: c…
right im off, nighty night 🙂
(well might sneak back later …)
[Previous page](https://forum.pinegrow.com/t/css-grid-problems/5680.md?page=1)
