Align elements

Store Design
1

I needed these 4 images and the text to be aligned and with their proper spacing, but from 990px ​​to 1600px they look like this. Can anyone help me?

pimpoclothing_0-1744543875207.png
pimpoclothing_0-1744543875207.png1089×862 171 KB

1 Like
2

@pimpaoclothing

Please share your store URL!

Thanks!

1 Like
3

Hello, here it is:

https://umhw5c-2w.myshopify.com/

4

@pimpaoclothing

Please add the following CSS code to your assets/base.css at the bottom of the file.

@media screen and (min-width: 990px) {

    #shopify-section-template--24835640394052__image_text_grid_N4TnFL .grid-image img {
        width: 300px !important;
        max-width: max-content !important;
    }

  #shopify-section-template--24835640394052__image_text_grid_N4TnFL .grid-content {
    gap: 60px !important;
}

}

Thanks!

1 Like
5

It worked! Thanks, I just needed a small change, I just wanted the vertical center spacing of the 4 images to be more similar to the horizontal, how can I change it?

6

@pimpaoclothing

Can you share the screenshot of what you want?

Thanks!

7

Yes! I need the same gap in the midle os the grid images, like this:

pimpoclothing_0-1744547664633.png
pimpoclothing_0-1744547664633.png951×489 284 KB

8

@pimpaoclothing

Please add the following CSS code to your assets/base.css at the bottom of the file.

@media screen and (min-width: 990px) {
 #shopify-section-template--24835640394052__image_text_grid_N4TnFL .image-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-gap: 15px !important;
    flex: 1;
    line-height: normal !important;
}
}

Thanks!

1 Like