Solved

How to align image in a multi column to the middle but keep the text aligned to the left in Dawn

julian-dadang
Shopify Partner
70 0 22

At the moment the entire multi column is aligned to the left which makes the text look good but the image is too far to the side. How can I centre the image but keep the text the same?

 

juliandadang_0-1645757764882.png

 

Store: https://art-from-kabushka-ngemba.myshopify.com/collections/clothing

Password: shiayo

Accepted Solution (1)

KetanKumar
Shopify Partner
36905 3641 11986

This is an accepted solution.

@julian-dadang 

sorry for that issue can you try

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

.slider-mobile-gutter .multicolumn-card-spacing {margin: 0px auto;}

 

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 8 (8)

oscprofessional
Shopify Partner
15905 2378 3087

@julian-dadang ,

.multicolumn-card__image-wrapper.multicolumn-card__image-wrapper--half-width.multicolumn-card-spacing {
    margin: 0 auto;
}

Add this css at the bottom of Online Store->Theme->Edit code->Assets->base.scss.liquid

Get pass your Store Core Web Vital Free Speed Optimization Audit, Chat on WhatsApp | Skype : oscprofessionals-87 | Email: pallavi@oscprofessionals.com | Hire us | Guaranteed Site Speed Optimization | Website Free Audit | Shopify Theme Customization | Build Shopify Private App | Shopify SEO | Digital Marketing | Oscp Upsell & Cross sell App : Free | Oscp Sales & Volume Discount App : Free | Custom Pricing Wholesale App : Free

ZestardTech
Shopify Expert
5618 1022 1348

Hello There,

1. In your Shopify Admin go to online store > themes > actions > edit code
2. Find Asset >theme.css and paste this at the bottom of the file:

@media screen and (min-width: 1024px){
.multicolumn-card .multicolumn-card__image-wrapper {
margin: auto;
}
}
Want to modify or develop new app, Hire us.
If helpful then please Like and Accept Solution .
Email: support@zestard.com
Shopify Apps URL :- https://apps.shopify.com/partners/zestard-technologies
Custom Modifications Into Shopify Theme | Shopify Private App | SEO & Digital Marketing

KetanKumar
Shopify Partner
36905 3641 11986

This is an accepted solution.

@julian-dadang 

sorry for that issue can you try

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

.slider-mobile-gutter .multicolumn-card-spacing {margin: 0px auto;}

 

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
julian-dadang
Shopify Partner
70 0 22
Thank you this worked great!
KetanKumar
Shopify Partner
36905 3641 11986

@julian-dadang 

its my pleasure to help us

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
SmileyinSK
Tourist
8 0 1

This worked perfectly! Thank you!

 

Smiley Acres, your friendly country store, online! Come visit us at smileyacres.ca.
KetanKumar
Shopify Partner
36905 3641 11986

@SmileyinSK its my pleasure to help us 

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

infoatcodelab7
Shopify Partner
593 141 147

@julian-dadang 

Please add this CSS to your css file

.multicolumn-card__image-wrapper {
    margin: 0 auto !important;
}

Thank You!

Want to modify or develop new website, Hire us.
If helpful then please Like and Accept Solution .
Email: info@codelab7.com