Solved

How to center images horizontally on Dawn theme

Xaxoxuxu
Tourist
6 0 2

Hi, how can I center an "image with text" section that has only image? I just want to center an image horizontally without any text. For example:

Xaxoxuxu_0-1642942969183.png

I just want to use an image as a divider? Is there another easier way?

Another example:

Xaxoxuxu_1-1642943012373.png

 

Accepted Solution (1)
KetanKumar
Shopify Partner
36839 3635 11972

This is an accepted solution.

@Xaxoxuxu 

can you try this code

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

@media screen and (min-width: 750px) {
#shopify-section-template--15307744673979__16429426963923e0ed .grid--2-col-tablet .grid__item {
    max-width: 300px;
}
#shopify-section-template--15307744673979__16429426963923e0ed .image-with-text__grid {
    justify-content: center;
}

#shopify-section-template--15307744673979__16429426963923e0ed .image-with-text__grid .image-with-text__text-item.grid__item {
    display: none;
}
}

 

If helpful then please Like and Accept Solution.
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 10 (10)

KetanKumar
Shopify Partner
36839 3635 11972

@Xaxoxuxu 


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.
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
Xaxoxuxu
Tourist
6 0 2

Hey, thanks for the response.

Site: https://ilimilly.myshopify.com/

password: creugg

 

I just wanna center for example the "image with section" widget with the little bee on the homepage

KetanKumar
Shopify Partner
36839 3635 11972

This is an accepted solution.

@Xaxoxuxu 

can you try this code

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

@media screen and (min-width: 750px) {
#shopify-section-template--15307744673979__16429426963923e0ed .grid--2-col-tablet .grid__item {
    max-width: 300px;
}
#shopify-section-template--15307744673979__16429426963923e0ed .image-with-text__grid {
    justify-content: center;
}

#shopify-section-template--15307744673979__16429426963923e0ed .image-with-text__grid .image-with-text__text-item.grid__item {
    display: none;
}
}

 

If helpful then please Like and Accept Solution.
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
Xaxoxuxu
Tourist
6 0 2

Thank you very much, it's perfect!

laneocinco
Visitor
1 0 0

Hello! Tried this code but doesn't seem to work for me. Can you help with this? pyro555.com - pass: laneocinco555

volcanoking
Tourist
3 0 1

@KetanKumar I tried your code but it's not working for me. can you help?

https://volcano-king-coffee.myshopify.com/

password: dowsah

KetanKumar
Shopify Partner
36839 3635 11972

@volcanoking 

can you please provide screenshot further issue 

If helpful then please Like and Accept Solution.
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
volcanoking
Tourist
3 0 1

I want to center the divider between the two products

Screen Shot 2022-06-13 at 23.22.35.png

 

volcanoking
Tourist
3 0 1

@KetanKumar when it's in mobile mode the divider is centered but in desktop mode it's not. I know the text and button layout is the reason but I want to know how to adjust the alignment. Thanks

Jahid-KlinKode
Excursionist
145 1 4

Hi @Xaxoxuxu, need to center the image horizontally in the Shopify Dawn Theme? Check out this YouTube video: https://www.youtube.com/watch?v=LNCzj6cxw1s.