sleepy_rye Posted March 16, 2022 Share Posted March 16, 2022 Site URL: http://www.navigreenengineering.com Currently, the logos in my footer stay the same size as on desktop and stack vertically when on mobile. However, I want them to resize smaller and stack horizontally. Any suggestions? Beyondspace 1 Link to comment
Beyondspace Posted March 16, 2022 Share Posted March 16, 2022 1 hour ago, sleepy_rye said: Site URL: http://www.navigreenengineering.com Currently, the logos in my footer stay the same size as on desktop and stack vertically when on mobile. However, I want them to resize smaller and stack horizontally. Any suggestions? Try adding to Home > Design > Custom Css @media only screen and (max-width: 767px) { section[data-section-id="5fc3fa5a4e98326c028c86c5"] .content .sqs-layout > .row:first-child { display: grid; grid-template-columns: repeat(5,1fr) } section[data-section-id="5fc3fa5a4e98326c028c86c5"] .content .sqs-layout > .row:after ,section[data-section-id="5fc3fa5a4e98326c028c86c5"] .content .sqs-layout > .row:before{ content:unset !important; } } Let me know how it works on your site BeyondSpace - Squarespace Website Developer 🖼️ Lightbox Studio (Enable Pinch/Zoom on lightbox, video lightbox and much more) 🗓️ Delivery Date Picker (Squarespace Date picker form field) 💫 Gallery block 7.1 workaround 🥳 No-code customisations for Squarespace (+100 Spark plugin customisations) 🥳 Freemium Squarespace Widget Templates (+1000 Elfsight Templates) If you find my answer useful, let's leave a like or upvote so others with the same issue can find their solution. Thank you! Link to comment
Beyondspace Posted March 16, 2022 Share Posted March 16, 2022 My testing BeyondSpace - Squarespace Website Developer 🖼️ Lightbox Studio (Enable Pinch/Zoom on lightbox, video lightbox and much more) 🗓️ Delivery Date Picker (Squarespace Date picker form field) 💫 Gallery block 7.1 workaround 🥳 No-code customisations for Squarespace (+100 Spark plugin customisations) 🥳 Freemium Squarespace Widget Templates (+1000 Elfsight Templates) If you find my answer useful, let's leave a like or upvote so others with the same issue can find their solution. Thank you! Link to comment
sleepy_rye Posted March 16, 2022 Author Share Posted March 16, 2022 1 hour ago, bangank36 said: Try adding to Home > Design > Custom Css @media only screen and (max-width: 767px) { section[data-section-id="5fc3fa5a4e98326c028c86c5"] .content .sqs-layout > .row:first-child { display: grid; grid-template-columns: repeat(5,1fr) } section[data-section-id="5fc3fa5a4e98326c028c86c5"] .content .sqs-layout > .row:after ,section[data-section-id="5fc3fa5a4e98326c028c86c5"] .content .sqs-layout > .row:before{ content:unset !important; } } Let me know how it works on your site It works perfectly, you're a godsend. Any chance you feel like giving me an ELI5 of your thought process? Beyondspace 1 Link to comment
Beyondspace Posted March 16, 2022 Share Posted March 16, 2022 12 minutes ago, sleepy_rye said: It works perfectly, you're a godsend. Any chance you feel like giving me an ELI5 of your thought process? I just make the wrapper element grid style with 5 columns and remove the pseudo elements before and after. To get through them, I combine using the dev tool and squarespace id finder extension. Hope that it makes sense BeyondSpace - Squarespace Website Developer 🖼️ Lightbox Studio (Enable Pinch/Zoom on lightbox, video lightbox and much more) 🗓️ Delivery Date Picker (Squarespace Date picker form field) 💫 Gallery block 7.1 workaround 🥳 No-code customisations for Squarespace (+100 Spark plugin customisations) 🥳 Freemium Squarespace Widget Templates (+1000 Elfsight Templates) If you find my answer useful, let's leave a like or upvote so others with the same issue can find their solution. Thank you! Link to comment
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment