MattyT208 Posted May 18 Share Posted May 18 The logo on my homepage displays well on desktop but on mobile it drops way down on the page and is really small. Is there a way to anchor the logo's position and size when viewed on a mobile device? Here's the script I'm using: header-title-logo a { position: absolute; bottom: -105px; z-index: 9999; } /* Fix logo overlap */ .header-title-logo { width: 270px; } /* header shadow */ header#header { box-shadow: 3px 4px 5px rgba(0,0,0,0.5); } Link to comment
0 tuanphan Posted May 20 Share Posted May 20 Hi. What is your site url? We can check easier 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
0 MattyT208 Posted May 24 Author Share Posted May 24 On 5/20/2022 at 5:07 PM, tuanphan said: Hi. What is your site url? We can check easier https://cinnamon-arugula-lbx4.squarespace.com yil1TONG4toft*ib Link to comment
0 tuanphan Posted May 26 Share Posted May 26 On 5/25/2022 at 2:51 AM, MattyT208 said: https://cinnamon-arugula-lbx4.squarespace.com yil1TONG4toft*ib Don't remove any code in your current code. Add to Design > Custom CSS @media screen and (max-width:767px) { .header-title-logo a { bottom: 0; } .header-title-logo img { max-height: 100px; }} 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
0 MattyT208 Posted May 26 Author Share Posted May 26 That worked perfectly. Thank you! Link to comment
Question
MattyT208
The logo on my homepage displays well on desktop but on mobile it drops way down on the page and is really small. Is there a way to anchor the logo's position and size when viewed on a mobile device?
Here's the script I'm using:
header-title-logo a {
position: absolute;
bottom: -105px;
z-index: 9999;
}
/* Fix logo overlap */
.header-title-logo {
width: 270px;
}
/* header shadow */
header#header {
box-shadow: 3px 4px 5px rgba(0,0,0,0.5);
}
Link to comment
Top Posters For This Question
2
3
Popular Days
May 26
2
May 18
1
May 20
1
May 24
1
Top Posters For This Question
tuanphan 2 posts
MattyT208 3 posts
Popular Days
May 26 2022
2 posts
May 18 2022
1 post
May 20 2022
1 post
May 24 2022
1 post
4 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