Change displayed size images in Multicolumn section - Down theme

Solved

Change displayed size images in Multicolumn section - Down theme

Cristim
Tourist
6 0 2

Hi, I would like to adjust the image size in the "Multicolumn" section. They are currently displayed much larger. The images are 100px wide.
Can someone help me with what should I modify on liquid file?
Thank you.

images-larger.jpg

Accepted Solution (1)
Zworthkey
Shopify Partner
5581 641 1581

This is an accepted solution.

Hii, @Cristim 
Paste this code on top of the section-multicolumn.css file.

.multicolumn-card__image-wrapper--third-width {
    width: 20% !important;
}

Thank You.

View solution in original post

Replies 13 (13)

Zworthkey
Shopify Partner
5581 641 1581

Hii, @Cristim 
Kindly share your store URL so,
I can solve your problem perfectly.
Thank You.

Cristim
Tourist
6 0 2
Zworthkey
Shopify Partner
5581 641 1581

Hii, @Cristim 
I can't see your multicolumn section.
Thank You.

Cristim
Tourist
6 0 2

Oh, it was deactivated. Now is active.

Zworthkey
Shopify Partner
5581 641 1581

This is an accepted solution.

Hii, @Cristim 
Paste this code on top of the section-multicolumn.css file.

.multicolumn-card__image-wrapper--third-width {
    width: 20% !important;
}

Thank You.

Cristim
Tourist
6 0 2

Thank you!!! ❤️

leonidpetrov
Tourist
6 0 4
Where exactly do we paste this code in the section-multicolumn.css file.
seeglster
Tourist
4 0 1

I agree, where exactly do we paste this? @Cristim. I tried a few different places, including at the top of the section-multicolumn.css file and nothing has worked so far.

Bastiaan123
Tourist
8 0 0

Yea i got the same problem...

Bastiaan123
Tourist
8 0 0

Hi, Could you show me exactly where to put the code? Thank you

nar_52
Excursionist
16 0 4

@Bastiaan123 

If you still have the same problem. You don’t need an additional coding. Go to your section-multicolumn.css file and just change the percentage in line 23 e.g. to 15% -> 

 

.multicolumn-card__image-wrapper--third-width {
width:15%;
}

 

Don’t forget to select in the editing mode of your theme : one-third width of the column as the image width. (See right side of the picture in the original post).

 

Hope this helps.

deluc004
Excursionist
40 1 8

No luck

Screenshot 2024-06-30 at 00.37.34.png

Screenshot 2024-06-30 at 00.37.48.png

 

jrfellers
Tourist
9 0 2

Has anyone tried to do this in Dawn?  The multicolumn.liquid.css is quite complicated and even after doing a copy/paste to Notepad and searching for the phrase "..multicolumn-card__image-wrapper--third-width {" I could not find it anywhere in the code. 


Dawn makes these huge and impossible to control.  Resizing controls just make the image chosen blurry while forcing the smaller image to occupy the same space. 

 

Thanks in advance!