How to contain the image in the portfolio grid

Anco326 · January 5, 2023

Hello,

Would someone know the CSS code to contain the images in the Portfolio simple or Overlay? The default is

object-fit : cover;

I tried the following without any success, what am I missing =?

#grid-image-inner-wrapper img {
width: 100%;
height: 100%;
object-position: 50% 50%;
object-fit: contain !important;
}

Thank you !

tuanphan · January 8, 2023

"contain the image" - Can you explain this?

And what is your site url?

Anco326 · January 10, 2023

On 1/8/2023 at 6:57 PM, tuanphan said:

"contain the image" - Can you explain this?

And what is your site url?

I want the images illustrating the logos to be contained in the containers. As of now the images are covering the container and is clipped.

Thank you!

Edited January 11, 2023 by Anco326

beatrizc · January 10, 2023

Hey @Anco326!

From what I can see, the grid-image-inner-wrapper is a class, not an ID.

So, if you modify the selector slightly in your code and use a period instead of a pound sign, you should be set!

.grid-image-inner-wrapper img {
width: 100%;
height: 100%;
object-position: 50% 50%;
object-fit: contain !important;
}

Hope that helps!

Anco326 · January 11, 2023

Thank you, that worked !!

Recommended Posts