Shingston Posted June 13 Posted June 13 (edited) Hi, I'm wondering if there is a way to remove margins from my 2 portfolio landing pages? I've added 2vw site margin (page width 1170px) but there seems to be extra margin on the portfolio pages, so the thumbnails appear narrower than the rest of the pages on the site: I’d like the portfolio thumbnails to be wider so they’re the same width as the content on the sub-pages, OR the sub-pages to be narrower - I just want them to match. The portfolio and sub-page content widths are the same if I remove the margin, but then there is no space either side of the content when viewed on a tablet screen. Or can I add site-wide margins/padding via css instead that ensures the content width is consistent? Thanks so much in advance! Edited June 13 by Shingston clarity
JayVanDyke Posted June 13 Posted June 13 @Shingston link? ☕ Did I help you? Buy me a coffee! 👨💻 Bergen Design Co. 💻 I'm for hire on Upwork! 🕸️ Squarespace Experts 🖥️ 99Designs 🛠️ Web Designer's Toolkit **some of these contain affiliate links
Lesum Posted June 13 Posted June 13 @Shingston Hi! Add this code under Custom CSS panel: div#gridThumbs { padding-left: 0 !important; padding-right: 0 !important; } If my comments were useful, please like or mark my solution as answer so others can scroll to it quickly. Sam Web Developer & Digital Designer ☕ Did you find my contribution helpful? Buy me a coffee?
Shingston Posted June 13 Author Posted June 13 Hi Lesum, thank you, that did work, but the code removes the margin completely so now the content touches the sides of the screen on mobile and tablet. So I do want the margins, I just want them to be consistent, so that the thumbnail page is the same width as the rest of the pages. Maybe it’s possible the other way around? So a bit more padding or margin is added to the rest of the pages on the website, instead of removing it from the 2 thumbnail pages? Thanks for your help with this - much appreciated.
JayVanDyke Posted June 13 Posted June 13 @Shingston try adjusting @Lesum code to be 20px instead of 0. It looks like thats what you have set as your column gap. ☕ Did I help you? Buy me a coffee! 👨💻 Bergen Design Co. 💻 I'm for hire on Upwork! 🕸️ Squarespace Experts 🖥️ 99Designs 🛠️ Web Designer's Toolkit **some of these contain affiliate links
Lesum Posted June 13 Posted June 13 @Shingston as @JayVanDyke suggested, here's the updated code: div#gridThumbs { padding-left: 20px !important; padding-right: 20px !important; } JayVanDyke 1 If my comments were useful, please like or mark my solution as answer so others can scroll to it quickly. Sam Web Developer & Digital Designer ☕ Did you find my contribution helpful? Buy me a coffee?
Shingston Posted June 13 Author Posted June 13 Thank you. Whatever value I put in (I tried 20, 50, 100) other than 0, takes it back to the same width as at the start (narrower than the sub-page content). And 0 leaves no margin on mobile and tablet.
Shingston Posted June 13 Author Posted June 13 is there a way to add padding to the sub-pages (ie all the other pages on the site) instead of removing it from the portfolio pages?
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment