1 column Summary block layout on mobile only

Site URL: https://rumahkeduamedia.com

is it possible to make the layout summary on the desktop remain as it is today, while on the mobile it changes to 1 part because the current summary when opened on mobile is very small and uncomfortable when pressing the arrow, except for the summary  type list

Add to Design > Custom CSS > Then save & reload the site

@media screen and (max-width:767px) {
div#block-yui_3_17_2_1_1652790822955_18965 .summary-item {
    display: flex;
    flex-direction: column;
    width: 100% !important;
}
}

10 hours ago, tuanphan said:

Add to Design > Custom CSS > Then save & reload the site

@media screen and (max-width:767px) {
div#block-yui_3_17_2_1_1652790822955_18965 .summary-item {
    display: flex;
    flex-direction: column;
    width: 100% !important;
}
}

 

On 5/25/2022 at 6:35 PM, yogap said:

hey looks great thanks, but can add margin from read more link  to thumbnail?

 

Use this new code

@media screen and (max-width: 767px) {
    div#block-yui_3_17_2_1_1652790822955_18965 .summary-item {
        display: flex;
        flex-direction: column;
        width: 100% !important;
        margin-bottom: 50px !important;
    }
}

On 5/25/2022 at 1:29 PM, tuanphan said:

Add to Design > Custom CSS > Then save & reload the site

@media screen and (max-width:767px) {
div#block-yui_3_17_2_1_1652790822955_18965 .summary-item {
    display: flex;
    flex-direction: column;
    width: 100% !important;
}
}

 

Hey, this piece of code has worked great for me too but I was wondering if it's possible to restrict the summary block on mobile to also be 1 item tall? As opposed to multiple items stacked on top of each other. Thanks!

On 1/17/2023 at 6:19 AM, KLharvey said:

Hey, this piece of code has worked great for me too but I was wondering if it's possible to restrict the summary block on mobile to also be 1 item tall? As opposed to multiple items stacked on top of each other. Thanks!

You mean show slider with 1 item/row?