patrycjahelena_ Posted July 23, 2023 Share Posted July 23, 2023 hi, i've recently built my portfolio and there are some things that i can't perfect on my own. i have 3 columns of pictures in the gallery on my main page but once you check the mobile, there are only 2 columns which leaves one odd picture at the end and in general gives a worse visual pairing than the desktop version. any way i can fix that with css? this is my page: https://patrycjahelenabielawska.squarespace.com/ thank you! Link to comment
Solution Ziggy Posted July 24, 2023 Solution Share Posted July 24, 2023 You could solve this in a few different ways, one way might be to add 3 more images, that way you have an even number so it would look better as a 2-wide grid, but also good as 3-wide. Another option would be to go to a 1-column on mobile or keep 3-columns on mobile, both can be achieved with CSS, and change the user experience in different ways. 3 will have very small images on mobile and leave some white space at the bottom, and 1 would create big images with a long scroll. patrycjahelena_ 1 Please like and upvote if my comments were helpful to you. Cheers! Zygmunt Spray Squarespace Website Designer Contact me: https://squarefortytwo.com ☕ Did I help? Buy me a coffee? 🔌 Ghost Squarespace Plugins (Referral link) 📈 SEO Space (Referral link) ⬛ SquareWebsites Plugins (Referral link) 🔲 SQSP Themes (Referral link) ✨ Spark Plugin (Referral link) Link to comment
patrycjahelena_ Posted July 25, 2023 Author Share Posted July 25, 2023 i wanted to avoid adding extra pictures as i feel like this amount is just right to capture the essence and grouping these pictures in twos instead of threes alters the overall perception. but you make a good point that threes would be too small for a mobile screen, and definitely scrolling through 2 images at a time is better than scrolling through one. thank you for the input and giving me a fresh perspective. i will add extra row to compromise ☺️ Ziggy 1 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