How can I make my multicolumn image full size?

Shopify Discussion
1

Hello!

I would like to make my image of the multicolumn section full-size, so that they fit the entire screen. Can someone help me get the right code for this? Thank you so much in advance.

melbakker_0-1658402039057.png
melbakker_0-1658402039057.png2482×1280 862 KB

Kind regards

Mel

2

Hi and welcome!

Could you post a link to your store and I will look into it for you :slightly_smiling_face:

3

@mel999

Could you provide me store URL? I should be able to answer your question.

Yours faithfully!

4

Thank you for your answer. The link is: https://kp8xrgjku1j2e9bt-62119084228.shopifypreview.com

5

Thank you for your answer! The link is: https://kp8xrgjku1j2e9bt-62119084228.shopifypreview.com

6

Hi!

Add these to the bottom of your base.css file:

.page-width.section-template--15650456535236__multicolumn-padding.isolate {
    padding: 0 !important;
    margin: 0 !important;
    max-width: 100% !important;
}

.multicolumn-card__image-wrapper.multicolumn-card__image-wrapper--full-width.multicolumn-card-spacing {
    margin-left: 0 !important;
    margin-right: 0 !important;
}

ul#Slider-template--15650456535236__multicolumn {
    text-align: center;
}
7

Thank you for your help! However, the size of the picture seems to stay the same. I want to make the size of all multicolumns max width. Any other ideas?

8

No problem!

Ahh i thought you only wanted the first image to be max-width, could you post another link to your store and ill provide you the code for this :slightly_smiling_face:

9

Thank you, this is the link: https://nm8frnyce9yeq486-62119084228.shopifypreview.com

The size of the first picture did not become max width either. Hope you are able to help :)!

10

How strange, try adding this to the bottom of your base.css file:

.page-width {
    max-width: 100% !important;
}
11

Something went wrong on my end, trying to preview a duplication. The codes work, thank you so much for the help!!

12

No problem!

You’re very welcome! Please take a moment to read my signature below, I would highly appreciate it :heart:

1 Like
13

Dear WoodyDev,

This worked great for the desktop version of the site but not for the mobile version. Could you help me further with this?

https://l40rw6awac0egaz7-62119084228.shopifypreview.com

Greetings,

Mel