Summary Block - Force 5 Items Per Row On Mobile - CSS

Site URL: https://www.tlastmarks.com/pre-k

Password: Devon

Hi!  I'm looking to force 5 per row on mobile in the summary block in the footer of this website with CSS.  

Hope you can help!  @tuanphan @creedon  @bangank36 

It looks like you use Summary Block - Wall Layout

Just changed it to Grid Layout, then add this to Design > Custom CSS

@media screen and (max-width:767px) {
div#block-yui_3_17_2_1_1660330628278_11970 .summary-item {
    width: 20% !important;
}
}

On 8/13/2022 at 10:48 PM, tuanphan said:

It looks like you use Summary Block - Wall Layout

Just changed it to Grid Layout, then add this to Design > Custom CSS

@media screen and (max-width:767px) {
div#block-yui_3_17_2_1_1660330628278_11970 .summary-item {
    width: 20% !important;
}
}

 

hi!  unfortunately I changed it to grid layout and it still doesn't work 😕. Not sure what's going on...would love if you could help with this as I am also encountering the issue in another summary block section 🙂

Devon

incorrect password now

new PW: Justin16!

17 hours ago, DevonHarris said:

new PW: Justin16!

It looks fine to me

@tuanphan my fix was just to create and hide a new section.  However I am running into the same issue throughout other sections of the website, for example the "programs" section of the home page, which I would like to display 4 across on ipad screen sizes.  Not sure what to do...password is 20222023

On 9/3/2022 at 12:19 AM, DevonHarris said:

@tuanphan my fix was just to create and hide a new section.  However I am running into the same issue throughout other sections of the website, for example the "programs" section of the home page, which I would like to display 4 across on ipad screen sizes.  Not sure what to do...password is 20222023

This section?