dritschlermedia Posted March 12, 2022 Share Posted March 12, 2022 Site URL: https://kangaroo-cyan-yjet.squarespace.com/ Password to enter the site is "prosper". I am attempting the make the logo height taller than the header. The logo for the site is a banner type logo that I would like to hang down past the header. There must be a way to manually adjust the header and logo sizing in CSS. Link to comment
tuanphan Posted March 13, 2022 Share Posted March 13, 2022 Add to Design > Custom CSS header#header img { position: relative; bottom: -50px; } 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
dritschlermedia Posted March 14, 2022 Author Share Posted March 14, 2022 17 hours ago, tuanphan said: Add to Design > Custom CSS header#header img { position: relative; bottom: -50px; } This gets the logo to drop below the header, but it does not allow me to adjust the logo size relative to the size of the header. I need the header to be the shortest height possible, and the logo to be large enough to be legible. Link to comment
Solution tuanphan Posted March 15, 2022 Solution Share Posted March 15, 2022 Add this new code .header-announcement-bar-wrapper { padding-top: 0 !important; padding-bottom: 0px !important; } header#header img { max-height: 150px; position: absolute; top: 50% !important; left: 50%; transform: translate(-50%,-50%); } header#header { margin-top: 25px; } 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
dritschlermedia Posted March 15, 2022 Author Share Posted March 15, 2022 9 hours ago, tuanphan said: Add this new code .header-announcement-bar-wrapper { padding-top: 0 !important; padding-bottom: 0px !important; } header#header img { max-height: 150px; position: absolute; top: 50% !important; left: 50%; transform: translate(-50%,-50%); } header#header { margin-top: 25px; } I was able to get this to work! Thank you! What I used: .header-announcement-bar-wrapper { padding-top: 10px !important; padding-bottom: 0px !important; } header#header img { max-height: 150px; position: absolute; top: 50% !important; left: 50%; transform: translate(-50%,-50%); margin-top: 33px; } header#header { margin-top: 0px; } 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