BarbaraD 44 Share Posted March 22, 2020 (edited) Site URL: https://translegal-llc.squarespace.com/ Hi, Am having no luck writing CSS to target a section in 7.1 to reduce the space above and below this image in a gallery section (screenshot). Would love some help! Thanks, Barbara Edited March 22, 2020 by BarbaraD Add a screenshot. Link to post
0 tuanphan 9,584 Share Posted March 23, 2020 Can you share password. -- I guess the code will be [data-section-id="enter section id here"] .content-wrapper {padding-top: 10px !important; padding-bottom: 10px !important;} Email me if you have need any help (free, of course :-D). Answer within 24 hours. How to: Setup password & share url Insert Custom CSS Open Page Header Upload Custom Font Find Block ID, Data Section ID Contact Squarespace Customer Care -- Yup! Link to post
0 BarbaraD 44 Author Share Posted March 23, 2020 (edited) Yes, sorry. Password is: t\ Edited March 2 by BarbaraD Link to post
0 BarbaraD 44 Author Share Posted March 23, 2020 I just set the section hight to small and the width to Large and the padding is reduced. Just needed the correct combination of settings: https://translegal-llc.squarespace.com/home-3 Would like to reduce the space above and below the slider even more, but am thinking that the way gallery sections work in 7.1 I am stuck with the default minimum space (10) between sections. Am still learning how to target sections, so thanks for showing me how to use the [data-section-id=""] Link to post
0 tuanphan 9,584 Share Posted March 23, 2020 14 minutes ago, BarbaraD said: I just set the section hight to small and the width to Large and the padding is reduced. Just needed the correct combination of settings: https://translegal-llc.squarespace.com/home-3 Would like to reduce the space above and below the slider even more, but am thinking that the way gallery sections work in 7.1 I am stuck with the default minimum space (10) between sections. Am still learning how to target sections, so thanks for showing me how to use the [data-section-id=""] You can adjust 10px to 0 Email me if you have need any help (free, of course :-D). Answer within 24 hours. How to: Setup password & share url Insert Custom CSS Open Page Header Upload Custom Font Find Block ID, Data Section ID Contact Squarespace Customer Care -- Yup! Link to post
0 jonongec 3 Share Posted December 10, 2020 I used your code ([data-section-id="enter section id here"] .content-wrapper {padding-top: 10px !important; padding-bottom: 10px !important;}) and set it to 0px but still finding the padding too much Is there a way to further reduce it? Link to post
0 tuanphan 9,584 Share Posted December 12, 2020 On 12/10/2020 at 4:24 PM, jonongec said: I used your code ([data-section-id="enter section id here"] .content-wrapper {padding-top: 10px !important; padding-bottom: 10px !important;}) and set it to 0px but still finding the padding too much Is there a way to further reduce it? Can you share link to page in screenshot? We can help easier Email me if you have need any help (free, of course :-D). Answer within 24 hours. How to: Setup password & share url Insert Custom CSS Open Page Header Upload Custom Font Find Block ID, Data Section ID Contact Squarespace Customer Care -- Yup! Link to post
0 AnaDavisDesign 4 Share Posted February 25 Same issue, but on mobile. www.marydisomma.com Link to post
0 tuanphan 9,584 Share Posted March 1 It looks fine here. Did you solve this? On 2/26/2021 at 3:35 AM, AnaDavisDesign said: Same issue, but on mobile. www.marydisomma.com Email me if you have need any help (free, of course :-D). Answer within 24 hours. How to: Setup password & share url Insert Custom CSS Open Page Header Upload Custom Font Find Block ID, Data Section ID Contact Squarespace Customer Care -- Yup! Link to post
0 AnaDavisDesign 4 Share Posted March 3 (edited) @tuanphan, no, I temporarily remade the home page. I still need help with this padding issue, please! 🙂 My work-around was to create a manual slideshow (a summary section that uses images from "fake" blog pages). It's not good though, because if anyone clicks on the images in the summary block, it takes them to the Fake blog pages. It's a mess right now. Would be much better to just fix the padding issue. Thank you! Edited March 3 by AnaDavisDesign Link to post
0 tuanphan 9,584 Share Posted March 7 On 3/3/2021 at 11:56 PM, AnaDavisDesign said: @tuanphan, no, I temporarily remade the home page. I still need help with this padding issue, please! 🙂 My work-around was to create a manual slideshow (a summary section that uses images from "fake" blog pages). It's not good though, because if anyone clicks on the images in the summary block, it takes them to the Fake blog pages. It's a mess right now. Would be much better to just fix the padding issue. Thank you! Can you add slideshow? Then we can check easier Email me if you have need any help (free, of course :-D). Answer within 24 hours. How to: Setup password & share url Insert Custom CSS Open Page Header Upload Custom Font Find Block ID, Data Section ID Contact Squarespace Customer Care -- Yup! Link to post
0 AnaDavisDesign 4 Share Posted March 8 The slideshow is at this password protected page. Password: Baking1 Link to post
0 tuanphan 9,584 Share Posted March 20 Try adding to Design > Custom CSS /* Slide padding */ @media screen and (max-width:767px) { section[data-section-id="5fd2dc18a0405a46535148be"] .gallery-slideshow { padding-bottom: 2vw !important; height: 30vh !important; } } Also I see the site is a bit narrow on tablet. Do you want to increase width? Email me if you have need any help (free, of course :-D). Answer within 24 hours. How to: Setup password & share url Insert Custom CSS Open Page Header Upload Custom Font Find Block ID, Data Section ID Contact Squarespace Customer Care -- Yup! Link to post
0 creativesurfing 1 Share Posted April 5 Can anyone help me with a similar issue, I've tried various items in the above and none have worked. So the Custom CSS code below input into the 'design' section worked for most sections in that I can reduce the height, but unfortunately where I have a simple slideshow on my pages, reducing the height just seems to reduce the height of the slideshow itself rather than the padding top and bottom. There is just so much padding its making my site look a bit silly. [data-section-id="5e8f4059a780b645bb8468ac"] { min-height: 10vh !important; } [data-section-id="5e8f4059a780b645bb8468ac"] .content-wrapper { padding-top: 2px !important; padding-bottom: 2px !important; Does anyone know how to fix this? Thank you. See image - the top is the thumbnails displayed at the bottom of my slideshow, then a huge gap until the next section which is text. There is a similar gap at the top of the slideshow above the main image. Total code/squarespace newbie here. Link to post
0 creedon 810 Share Posted April 5 @creativesurfer Please post the URL to the page on your site. If your site is not public please set up a site-wide password, if you've not already done so. Post the password here. Adding a site-wide password is not a security breach. Please read the documentation at the link provided to understand how it works. We can then take a look at your issue. Find my contributions useful? Please like, upvote, mark my answer as best , and see my profile. Thanks for your support! Link to post
0 creativesurfing 1 Share Posted April 5 (edited) On 4/5/2021 at 8:13 PM, creedon said: @creativesurfer Please post the URL to the page on your site. If your site is not public please set up a site-wide password, if you've not already done so. Post the password here. Adding a site-wide password is not a security breach. Please read the documentation at the link provided to understand how it works. We can then take a look at your issue. I've made a copy of my actual site as I was concerned I would mess it up playing around editing code. Will I be able to move my subscription over to this new site which is currently showing as a trial? So on the site if you go to the 'projects' page, the gallery has too much padding top and bottom. And then if you click on a project, for example the first one - barn, you will see that the slideshow has a similar issue with lots of space above and below. And then lastly, it is possible to bring the header and footer in even further from the edges? I've got the maximum at the moment but I'd really like to bring it in more if possible. Thanks so much Edited April 13 by creativesurfing Link to post
0 creedon 810 Share Posted April 5 Lets take these issues one by one. I don't know if I'll be able to answer each issue but others may. 2 hours ago, creativesurfer said: on the site if you go to the 'projects' page, the gallery has too much padding top and bottom. You have two options. One is to reduce the spacing site-wide. The other is add the following to Design > Custom CSS. .gallery-grid[data-width="inset"] { padding-bottom : 3vw; padding-top : 3vw; } This is for v7.1. Let us know how it goes. Find my contributions useful? Please like, upvote, mark my answer as best , and see my profile. Thanks for your support! Link to post
0 creativesurfing 1 Share Posted April 6 (edited) 15 hours ago, creedon said: Lets take these issues one by one. I don't know if I'll be able to answer each issue but others may. You have two options. One is to reduce the spacing site-wide. The other is add the following to Design > Custom CSS. .gallery-grid[data-width="inset"] { padding-bottom : 3vw; padding-top : 3vw; } This is for v7.1. Let us know how it goes. Brilliant thank you!!! - the code worked really well for the gallery padding top and bottom. Is there a way to customise the gaps at the sides? Inset isn't really narrow enough. I tried adding width: 50% !important; to the code which works initially but then adds a random big white space at the bottom between the gallery and footer and also makes it look very small on mobile device. I managed to reduce the padding top and bottom of my slideshows by modifying a code found earlier on this thread, winning! The site spacing is really handy but it is already at the maximum page width and the header is still not inset as much as I would like it to be, not sure if there's anything else can be done with that? I'm sure I've seen squarespace based sites where its inset more. Edited April 6 by creativesurfer Link to post
0 creedon 810 Share Posted April 6 @creativesurfer The site password no longer works so it's hard for us to help. Find my contributions useful? Please like, upvote, mark my answer as best , and see my profile. Thanks for your support! Link to post
Question
BarbaraD 44
Site URL: https://translegal-llc.squarespace.com/
Hi,
Am having no luck writing CSS to target a section in 7.1 to reduce the space above and below this image in a gallery section (screenshot). Would love some help!
Thanks,
Barbara

Edited by BarbaraDAdd a screenshot.
Link to post
Top Posters For This Question
6
4
3
3
Popular Days
Mar 23
5
Apr 5
4
Apr 6
2
Feb 25
1
Top Posters For This Question
tuanphan 6 posts
BarbaraD 4 posts
AnaDavisDesign 3 posts
creativesurfing 3 posts
Popular Days
Mar 23 2020
5 posts
Apr 5 2021
4 posts
Apr 6 2021
2 posts
Feb 25 2021
1 post
Posted Images
19 answers to this question
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment