JUSTIN1234 Posted September 21, 2022 Share Posted September 21, 2022 I tried many attempts to have the previous and the next button straight. Currently the PREVIOUS button is above the NEXT button. I tried adjusting the line height to zero in site style but it's still not aligned. It would be greatly appreciated if anybody knows how to solve this and makes them straight. Link is https://www.lexta.co/lookbook/boon-sofa-ideas-1 Link to comment
Ziggy Posted September 21, 2022 Share Posted September 21, 2022 There's the same question being asked and answered in this thread, which will hopefully help you out: JUSTIN1234 1 Please like and upvote if my comments were helpful to you. Cheers! Zygmunt Spray Squarespace Website Designer Contact me: https://squarefortytwo.com Hire me on Upwork! 🔌 Ghost Squarespace Plugins (Referral link) 📈 SEO Space (Referral link) ⬛ SquareWebsites Plugins (Referral link) 🔲 SQSP Themes (Referral link) ✨ Spark Plugin (Referral link) 🖼️ Pinch-to-Zoom Gallery Lightbox Plugin (Referral link) ☕ Did I help? Buy me a coffee? Link to comment
tuanphan Posted September 22, 2022 Share Posted September 22, 2022 Try adding this to Design > Custom CSS @media screen and (max-width:640px) { nav.BlogItem-pagination.clear { display: flex; justify-content: space-between; } nav.BlogItem-pagination.clear:after { display: none; } } JUSTIN1234 1 Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message Contact Customer Care - Learn CSS - Buy me a coffee (thank you!) Link to comment
JUSTIN1234 Posted September 27, 2022 Author Share Posted September 27, 2022 On 9/22/2022 at 5:31 PM, tuanphan said: Try adding this to Design > Custom CSS @media screen and (max-width:640px) { nav.BlogItem-pagination.clear { display: flex; justify-content: space-between; } nav.BlogItem-pagination.clear:after { display: none; } } It worked perfectly. Thank you so much for help. I really appreciated. Link to comment
JUSTIN1234 Posted September 27, 2022 Author Share Posted September 27, 2022 On 9/21/2022 at 3:46 PM, Ziggy said: There's the same question being asked and answered in this thread, which will hopefully help you out: Thank you for sharing, I have seen that thread but the codes only helped that specific site. Tuanphan have solved my problem and it works perfectly now. tuanphan 1 Link to comment
zooeythecat Posted August 28 Share Posted August 28 This isn't doing the trick for me. Any idea how to align the old and new blog post buttons, @tuanphan? https://mushroom-greyhound-d7ly.squarespace.com/recipes (pw: brimley) I do have some code to customize the buttons - maybe that is getting in the way? Link to comment
tuanphan Posted September 1 Share Posted September 1 On 8/29/2024 at 3:43 AM, zooeythecat said: This isn't doing the trick for me. Any idea how to align the old and new blog post buttons, @tuanphan? https://mushroom-greyhound-d7ly.squarespace.com/recipes (pw: brimley) I do have some code to customize the buttons - maybe that is getting in the way? Left you use :before Right you use :after Right >> you can change it to :before You will have this Next, use this CSS code to fix left button overflow screen @media screen and (max-width:767px) { nav.blog-list-pagination .prev-label:before, nav.blog-list-pagination .next-label:before { position: absolute; left: 50%; transform: translateX(-50%); top: -30px; } nav.blog-list-pagination .prev-label, nav.blog-list-pagination .next-label { position: relative; width: calc(~"100% - 20px"); } } Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message Contact Customer Care - Learn CSS - Buy me a coffee (thank you!) Link to comment
zooeythecat Posted September 3 Share Posted September 3 @tuanphan - Thanks so much--this worked great on mobile. However, now on desktop, the right nav (Older Posts) has extra spacing on the right. Any idea how we can fix? https://mushroom-greyhound-d7ly.squarespace.com/recipes?offset=1724787188246 Link to comment
tuanphan Posted September 7 Share Posted September 7 On 9/1/2024 at 5:58 PM, tuanphan said: Left you use :before Right you use :after Right >> you can change it to :before You will have this Next, use this CSS code to fix left button overflow screen @media screen and (max-width:767px) { nav.blog-list-pagination .prev-label:before, nav.blog-list-pagination .next-label:before { position: absolute; left: 50%; transform: translateX(-50%); top: -30px; } nav.blog-list-pagination .prev-label, nav.blog-list-pagination .next-label { position: relative; width: calc(~"100% - 20px"); } } Can you remove this change? I will write new code to exclude new change on desktop Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message Contact Customer Care - Learn CSS - Buy me a coffee (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