charlineca Posted August 25, 2022 Share Posted August 25, 2022 Site URL: https://andpartners.squarespace.com Hi, I coded a section to have a banner image on top of my navigation. On mobile, the banner is cropped to only show a part of it. However, I would like the whole banner to show on mobile. Can someone help with this? The site is andpartners.squarespace.com, password is partner. Link to comment
tuanphan Posted August 28, 2022 Share Posted August 28, 2022 Add this code to Design > Custom CSS @media screen and (max-width:767px) { body.homepage div#siteWrapper:before { height: 200px; } } Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
charlineca Posted August 29, 2022 Author Share Posted August 29, 2022 (edited) On 8/28/2022 at 9:36 AM, tuanphan said: Add this code to Design > Custom CSS @media screen and (max-width:767px) { body.homepage div#siteWrapper:before { height: 200px; } } Thank you! Do you know how I can fix the banner image size? Ideally, the height should always be 90% of the opening page, so the remaining 10% is the bottom navigation, but when I look at the size on a smaller desktop window, the banner size is sometimes larger, sometimes smaller and the navigation height becomes too high.. The code I used is this: body.homepage div#siteWrapper:before { content: ""; background-image: url(https://static1.squarespace.com/static/62f3ebaacb90d94c6979c02d/t/6306114bed97bb69afa5fb83/1661342032272/partnersone.jpg); background-size: cover; background-repeat: no-repeat; display: block; width: 100%; height: 680px; } Edited August 29, 2022 by charlineca 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