Dawn theme - applying multicolumn desktop look to tablet

Store Design
1

Hi guys, the previous code that I applied in order to change the width of the multicolumn on desktop view (code below) is not applying to tablet view. I want my tablet to look like my website as well. For mobile it’s already been set so dont need any changes for mobile side

The code that is currently applied to my website’s multicolumn

@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 view, which im happy with:

KelvinLeow_0-1689046563693.png
KelvinLeow_0-1689046563693.png400×294 60.2 KB

View on Tablet/iPad:

KelvinLeow_2-1689046563675.png
KelvinLeow_2-1689046563675.png286×400 53 KB

Website: fonpintar.com.my
password:taclau

2

@KelvinLeow

Please try this CSS code.

@media (min-width: 750px) {
ul#Slider-template--19422052843839__ed23233f-a886-47db-a7c7-a3fe5696ffe6 {
    width: 60%;
    margin: 0 auto;
}
ul#Slider-template--19422052843839__2de070ff-624c-49bb-9b2f-9e3538099960 {
    width: 60%;
    margin: 0 auto;
}
}
3

Hello @KelvinLeow

You can try this code: it will be helpful to you

Go to the Online Store->Theme->Edit code->Assets->base.css>Add this code at the bottom

@media only screen and (min-width: 600px) {
ul#Slider-template--19422052843839__ed23233f-a886-47db-a7c7-a3fe5696ffe6 {
    width: 100%;
    margin-left: 0px !important;
}