How to reduce the size of multicolumn - dawn theme

[KelvinLeow]

Hi my multicolumn is looking a bit too big on the desktop where it just fits the whole screen. Is it possible to make it smaller and neater for desktop view?

www.fonpintar.myshopify.com

Password: taclau

[Moeed]

Hey @KelvinLeow 

Follow these Steps:

1) Go to Online Store
2) Edit Code
3) Find theme.liquid file
4) Add the following code in the bottom of the file above </body> tag.

<style>
@media (min-width: 768px) {
ul#Slider-template--19422052843839__ed23233f-a886-47db-a7c7-a3fe5696ffe6 {
    width: 60%;
    margin-left: 350px;
}
}
</style>

If I managed to help you then, don't forget to Like it and Mark it as Solution!

Best Regards,
Moeed

[KelvinLeow]

Hi I tried your solution but it didnt change anything 

[KelvinLeow]

Hi Moeed, your code works when I put it in Base.css. It has been working fine, but I just noticed that the tablet view is corrupted. For the current situation im happy with how the desktop view is but what I noticed is that it's not applying to the tablet/ipad.

@media (min-width: 750px) {
ul#Slider-template--19422052843839__ed23233f-a886-47db-a7c7-a3fe5696ffe6 {
    width: 60%;
    margin-left: 350px;
}

@media (min-width: 750px) {
ul#Slider-template--19422052843839__2de070ff-624c-49bb-9b2f-9e3538099960 {
    width: 60%;
    margin-left: 350px;
}

Current desktop & mobile view, which im okay with:

View on Tablet/iPad:

Looking forward to your reply.

[Made4uo-Ribe]

Hi @KelvinLeow ,

I understand that you want to reduce the multicolumn, but I dont know what exact sizes you want you can try this one. 

1. From your Shopify admin dashboard, click on "Online Store" and then "Themes".
2. Find the theme that you want to edit and click on "Actions" and then "Edit code".
3. In the "Assets" folder, click on "theme.css, styles.css or base.css" file, depending on which file your theme uses to store its CSS styles. At the bottom of the file, add the following CSS code:
4. And Save.

ul#Slider-template--19422052843839__ed23233f-a886-47db-a7c7-a3fe5696ffe6 li {
    width: auto;
    height: 100%;
    max-width: 100%;
    max-height: 100%;
}

• Result:
• 
• I hope it help. 

[C-O-J]

None of the solutions offered here helped my case. Does any body find out how to reduce the size of multicolumn???

[Made4uo-Ribe]

Hi @C-O-J 

Would you mind to share your store URL? Thanks!

[C-O-J]

Hello,

My store is not published yet, but here is the link https://admin.shopify.com/store/6ba227-21/themes

the access code is rewclo

Thank you,

Mahsan

[Made4uo-Ribe]

This is the admin URL. The URL from the preview also work. Thanks!

[C-O-J]

Ok. Thank you for letting me know.

[Made4uo-Ribe]

For this url i cant check your store. i need another url not this one. Thanks!

[C-O-J]

Ok. I wish you would have told me in your first message.

If this one also doesn't help, please guide me where I should get the URL that you can log in. I am new and all the guidance are greatly appreciated.

https://cxufaqarividfa25-85834989909.shopifypreview.com