MarisaFalconi Posted February 11, 2022 Share Posted February 11, 2022 Site URL: http://www.replenishyoustudio.com I have a summary block on my home page that shows up just fine on desktop view, but enlarges to one-per-screen on my mobile view. I'd like the images to be smaller and 2-per-scroll instead of one big square going by, so that my mobile view looks similar to my desktop view. This is what I'd like: Instead of this: Link to comment
Caroline_Smith Posted February 11, 2022 Share Posted February 11, 2022 Hi! This CSS snippet will make all summary blocks on your home page a 2-column grid at the mobile views. Add it the the Header code injection of your home page to see this: <style> @media(max-width: 768px) { .summary-item-list { display: grid !important; grid-template-columns: 1fr 1fr !important; grid-column-gap: 15px !important; } } </style> tuanphan 1 Feel free to email me with any customization inquiries or questions you may have! Free Squarespace Resources: DevTools Minicourse, 11-Step Guide to Improve Custom CSS, Free Product/Pricing Comparison Table Generator 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