Dawn Image Section to The Center

Legacy boards (read-only) Education & Credentials
,
1

hello, I’m using a dawn theme, i would like to move the images section to the center along with a title as well.

in theme section, images can be move to the left and right only. there is no center option as i checked.

I would greatly appreciate it if you could provide a way.

pls see attached link for your reference QF11 – My Store

thank you

Faiz01_0-1737614509283.png
Faiz01_0-1737614509283.png628×771 136 KB

2

Hi @Faiz01 ,

You can follow the steps here:

Step 1: Shopify admin > Online store > Customize: https://prnt.sc/XQ6IDB99kUCd
Step 2: From the left menu > Theme settings > Open Custom CSS: https://prnt.sc/ypQ7nly2wv27
Step 3: Copy the code below and paste it there

Here is the code for step 3:

.product.product--medium.product--left.product--thumbnail_slider {
    flex-direction: column-reverse !important;
    align-items: center !important;
}

Here is the result:

DaisyVo_0-1737615298358.png
DaisyVo_0-1737615298358.png915×656 134 KB

Please let me know if it works!

Best,
Daisy

1 Like
3

Hi Faiz01

  • You can try to follow this step
    Step 1: Go to Edit code
    Step 2: Find file base.css and add this code at the end of the file
.product.product--medium.product--left.product--thumbnail_slider.product--mobile-show.grid.grid--1-col.grid--2-col-tablet {
    flex-direction: column-reverse;
    align-items: center;
}

Result:

LizHoang_0-1737615705271.png
LizHoang_0-1737615705271.png904×711 123 KB

Best,
LizHoang

1 Like
4

Hi @Faiz01

Please add this code to Custom CSS in Online Store > Themes > Customize > Theme settings

@media (min-width: 750px) {
    .product {
        flex-direction: column-reverse;
        align-items: center;        
    }
}
1 Like
5

Thank you for your swift reply. I really appreciate it, it works. Thanks again!

6

Thank you for your swift reply. I really appreciate it, it works too. Thanks again!

7

Thank you for your swift reply. I really appreciate it, this works also too. Thanks again!