What's your biggest current challenge? Have your say in Community Polls along the right column.

Testament Theme, box grid gallery alignment

Solved

Testament Theme, box grid gallery alignment

gianluigi
Excursionist
28 1 10

Hy,

How to make the bottom part of this kind of gallery aligned? the right column with 3 images doesn't reach the big image on the left basement

 

Regards

space.png

Accepted Solutions (8)

KetanKumar
Shopify Partner
37448 3664 12120

This is an accepted solution.

@gianluigi 

Sorry you are facing this issue, it would be my pleasure to help you.

Welcome to the Shopify community!😊
Thanks for your good question.

Please share your site URL,
I will check out the issue and provide you a solution here.

If helpful then please Like and Accept Solution. Partnership of your ️ Coffee Tips and my code can bring miracles.
Want to modify or custom changes on store Hire Me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing

View solution in original post

KetanKumar
Shopify Partner
37448 3664 12120

This is an accepted solution.

@gianluigi 

yes, please confirm this

KetanKumar_0-1644432076502.png

 

If helpful then please Like and Accept Solution. Partnership of your ️ Coffee Tips and my code can bring miracles.
Want to modify or custom changes on store Hire Me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing

View solution in original post

KetanKumar
Shopify Partner
37448 3664 12120

This is an accepted solution.

@gianluigi 

i mean please check my attachment its proper so i will give you that code

If helpful then please Like and Accept Solution. Partnership of your ️ Coffee Tips and my code can bring miracles.
Want to modify or custom changes on store Hire Me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing

View solution in original post

KetanKumar
Shopify Partner
37448 3664 12120

This is an accepted solution.

@gianluigi 

yes, please try this code

1. Go to Online Store->Theme->Edit code
2. Asset->/stylesheet.css ->paste below code at the bottom of the file.

.promo-1521604513411-2 .box-ratio {
    padding-bottom: 107% !important;
    position: relative;
}

.promo-1521604513411-2 img {
    position: absolute !important;
    top: 0;
    height: 100%;
}

 

If helpful then please Like and Accept Solution. Partnership of your ️ Coffee Tips and my code can bring miracles.
Want to modify or custom changes on store Hire Me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing

View solution in original post

KetanKumar
Shopify Partner
37448 3664 12120

This is an accepted solution.

@gianluigi 

oh sorry for that can you please send issue images?

If helpful then please Like and Accept Solution. Partnership of your ️ Coffee Tips and my code can bring miracles.
Want to modify or custom changes on store Hire Me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing

View solution in original post

gianluigi
Excursionist
28 1 10

This is an accepted solution.

KetanKumar
Shopify Partner
37448 3664 12120

This is an accepted solution.

@gianluigi 

We have checked for this issue in real system and browserstack but it is working ok. In which system configuration or browser you are checking?

If helpful then please Like and Accept Solution. Partnership of your ️ Coffee Tips and my code can bring miracles.
Want to modify or custom changes on store Hire Me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing

View solution in original post

KetanKumar
Shopify Partner
37448 3664 12120

This is an accepted solution.

@gianluigi 

ok same issue other device?

If helpful then please Like and Accept Solution. Partnership of your ️ Coffee Tips and my code can bring miracles.
Want to modify or custom changes on store Hire Me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing

View solution in original post

Replies 16 (16)

KetanKumar
Shopify Partner
37448 3664 12120

This is an accepted solution.

@gianluigi 

Sorry you are facing this issue, it would be my pleasure to help you.

Welcome to the Shopify community!😊
Thanks for your good question.

Please share your site URL,
I will check out the issue and provide you a solution here.

If helpful then please Like and Accept Solution. Partnership of your ️ Coffee Tips and my code can bring miracles.
Want to modify or custom changes on store Hire Me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
KetanKumar
Shopify Partner
37448 3664 12120

This is an accepted solution.

@gianluigi 

yes, please confirm this

KetanKumar_0-1644432076502.png

 

If helpful then please Like and Accept Solution. Partnership of your ️ Coffee Tips and my code can bring miracles.
Want to modify or custom changes on store Hire Me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
gianluigi
Excursionist
28 1 10

Sorry, what I have to confirm?

KetanKumar
Shopify Partner
37448 3664 12120

This is an accepted solution.

@gianluigi 

i mean please check my attachment its proper so i will give you that code

If helpful then please Like and Accept Solution. Partnership of your ️ Coffee Tips and my code can bring miracles.
Want to modify or custom changes on store Hire Me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
gianluigi
Excursionist
28 1 10

Yes, Is perfect. Tnx!

KetanKumar
Shopify Partner
37448 3664 12120

This is an accepted solution.

@gianluigi 

yes, please try this code

1. Go to Online Store->Theme->Edit code
2. Asset->/stylesheet.css ->paste below code at the bottom of the file.

.promo-1521604513411-2 .box-ratio {
    padding-bottom: 107% !important;
    position: relative;
}

.promo-1521604513411-2 img {
    position: absolute !important;
    top: 0;
    height: 100%;
}

 

If helpful then please Like and Accept Solution. Partnership of your ️ Coffee Tips and my code can bring miracles.
Want to modify or custom changes on store Hire Me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
gianluigi
Excursionist
28 1 10

Hy,

I'm very sorry to re-open the ticket, but we've the "inverse" problem in mobile. The rule above is perfect for Desktop versiuon, but not for mobile. Take a look at attachment, please

KetanKumar
Shopify Partner
37448 3664 12120

This is an accepted solution.

@gianluigi 

oh sorry for that can you please send issue images?

If helpful then please Like and Accept Solution. Partnership of your ️ Coffee Tips and my code can bring miracles.
Want to modify or custom changes on store Hire Me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
gianluigi
Excursionist
28 1 10

This is an accepted solution.

Yes, sorry!

mobile.pngmobile.png

KetanKumar
Shopify Partner
37448 3664 12120

This is an accepted solution.

@gianluigi 

We have checked for this issue in real system and browserstack but it is working ok. In which system configuration or browser you are checking?

If helpful then please Like and Accept Solution. Partnership of your ️ Coffee Tips and my code can bring miracles.
Want to modify or custom changes on store Hire Me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
gianluigi
Excursionist
28 1 10

@KetanKumar 

Chrome mobile browser on Huawei P20 phone and Microsoft Edge "mobile version" on windows 10 Pro

KetanKumar
Shopify Partner
37448 3664 12120

This is an accepted solution.

@gianluigi 

ok same issue other device?

If helpful then please Like and Accept Solution. Partnership of your ️ Coffee Tips and my code can bring miracles.
Want to modify or custom changes on store Hire Me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
gianluigi
Excursionist
28 1 10

Hy @KetanKumar ,

As we can see, with every device (desktop, tablet or mobile) there is a "swing" of padding ogf that specific block: a percentage ogf 109% seems to be fine for desktop from 17" (

.promo-1521604513411-2 .box-ratio {
padding-bottom: 109% !important;
position: relative;
}

.promo-1521604513411-2 img {
position: absolute !important;
top: 0;
height: 100%;
})

But under that resolution the rule doesn't works as well. We cannot understand whay only that part of design works as bad. May we need an adapting rule to fix that?

 

Regards

KetanKumar
Shopify Partner
37448 3664 12120

@gianluigi 

oh sorry for late here 

but how can i check now your store url doesn't work can you please send again 

If helpful then please Like and Accept Solution. Partnership of your ️ Coffee Tips and my code can bring miracles.
Want to modify or custom changes on store Hire Me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
gianluigi
Excursionist
28 1 10

Hy, @KetanKumar 

Hope you can help me again: we've changed the config of homepage fotos, and we've got the same problem, but with another module. May you help us? problem.png

 

Regards