RatherGood Posted October 5, 2019 Share Posted October 5, 2019 I've been able to add CSS to set max width for the banner and overlay, but it doesn't center the image or work with small screens, AND then I still have to deal with the menu/brand ares (see screencaps). I'm thinking that setting a maximum width for the site that applies to banner (and overlay) menu page content galleries etc. But I can't seem to track down appropriate CSS. (Note: I'm a designer, not a developer or programmer, so this is part of my ongoing learning experience.) Link to comment
tuanphan Posted October 6, 2019 Share Posted October 6, 2019 @RatherGood You should share site url to check. Difficult to help with only screenshot. 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
RatherGood Posted October 6, 2019 Author Share Posted October 6, 2019 It's not live... But: https://owl-kale-7yxa.squarespace.com/config/ Link to comment
tuanphan Posted October 6, 2019 Share Posted October 6, 2019 @RatherGood Your site is private. Please setup password & share url. If you don't know how to, see here: https://beaverhero.com/squarespace-how-to/#How_to_Setup_Password_Share_Site_URL 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
e2astudio Posted October 6, 2019 Share Posted October 6, 2019 Most templates have a site width available in Site Styles. I'd recommend setting it there rather than using Custom CSS. Link to comment
RatherGood Posted October 6, 2019 Author Share Posted October 6, 2019 To view:https://owl-kale-7yxa.squarespace.com PW: %%%753 Link to comment
RatherGood Posted October 6, 2019 Author Share Posted October 6, 2019 3 hours ago, e2astudio said: Most templates have a site width available in Site Styles. I'd recommend setting it there rather than using Custom CSS. Bedford and can't find anything for site/page width Link to comment
tuanphan Posted October 7, 2019 Share Posted October 7, 2019 @RatherGood Seems fine here. Did you solve the problem? 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
Mdhanjal Posted October 7, 2019 Share Posted October 7, 2019 add spacer in both side in content. page. check then. Hi, I'm BITTU. A website developer with 8 years experience with Squarespace. if you need help and work with me email me here :- mandeepsquarespace@gmail.com Best Hourly Rate :- $15 Per Hour Link to comment
herzworks Posted October 7, 2019 Share Posted October 7, 2019 Howdy! If you're trying to fix an image issue - I would edit/crop the image as you want it before adding it to the site. But I'm not sure that's the problem? I actually don't see the image behavior that you're capturing with screenshots so maybe that's been fixed. If you want to limit the width of your content and navigation/site title/logos: //limit content width ever expanding #site{ max-width: 1000px; /*Adjust here.*/ margin-right: auto; margin-left: auto;} //limit nav/logos/titles .header-inner { max-width: 1000px; /*Adjust here.*/ } founder of herz.works and maker of dope playlists. Link to comment
RatherGood Posted October 9, 2019 Author Share Posted October 9, 2019 On 10/7/2019 at 3:15 PM, ctmccosh said: Howdy! If you're trying to fix an image issue - I would edit/crop the image as you want it before adding it to the site. But I'm not sure that's the problem? I actually don't see the image behavior that you're capturing with screenshots so maybe that's been fixed. If you want to limit the width of your content and navigation/site title/logos: //limit content width ever expanding #site{ max-width: 1000px; /*Adjust here.*/ margin-right: auto; margin-left: auto;} //limit nav/logos/titles .header-inner { max-width: 1000px; /*Adjust here.*/ } This works for the nav, but I still need a max width for banner/banner overlay that doesn't affect small views. This is what I have for that (I've applied it for preview purposes), but small screens look like attached screen cap and banner image is aligned top .banner-thumbnail-wrapper #thumbnail img { max-width: 1400px !important; width: 100vw !important; height: auto !important; margin: 0 auto !important; display: block !important; top: 0 !important; } .banner-thumbnail-wrapper #thumbnail { background-color: #FFF; } .color-overlay { max-width: 1400px !important; width: 100vw !important; height: auto !important; margin: 0 auto !important; display: block !important; top: 0 !important; } Link to comment
herzworks Posted October 9, 2019 Share Posted October 9, 2019 5 hours ago, RatherGood said: Ah! media screen! So that code only applies above certain screen sizes and leave the image alone for smaller ones, right? // looks like it's falling apart around 930px adjust as you need... @media only screen and (min-width: 925px) { .banner-thumbnail-wrapper #thumbnail img { max-width: 1400px !important; width: 100vw !important; height: auto !important; margin: 0 auto !important; display: block !important; top: 0 !important; } .banner-thumbnail-wrapper #thumbnail { background-color: #FFF; } .color-overlay { max-width: 1400px !important; width: 100vw !important; height: auto !important; margin: 0 auto !important; display: block !important; top: 0 !important; } } founder of herz.works and maker of dope playlists. Link to comment
herzworks Posted October 9, 2019 Share Posted October 9, 2019 and yay for midwives 🙂 founder of herz.works and maker of dope playlists. Link to comment
RatherGood Posted October 12, 2019 Author Share Posted October 12, 2019 On 10/9/2019 at 2:15 PM, ctmccosh said: and yay for midwives 🙂 Any way to centre the banner image in the container? Link to comment
herzworks Posted October 16, 2019 Share Posted October 16, 2019 Hey @RatherGood! Sorry I wasn't aware you replied. If you need more help perhaps you could email me? Thank you! I'm at hello@herz.works founder of herz.works and maker of dope playlists. Link to comment
Recommended Posts
Archived
This topic is now archived and is closed to further replies.