Need my logo to be fixed for all displays
-
Hi,
I’m trying to get the logo on my website to stay fixed in the corner, but depending on the browser or the size of display it jumps around and sometimes gets lost in the corner or cropped. Is there anything I should be adding to the code? At the moment this is what I have added:
.site-logo-link img {
max-height: 100px;
width: fixed;
position: relative;
right: 540px;
top: 250px;
}Thanks!
The blog I need help with is: (visible only to logged in users)
-
Hello @girleffecttrading
Try this:1. Remove all the codes from the CSS you gave above except max-height:
.site-logo-link img { max-height: 100px; }
2. And then add this CSS:
.site-branding { display: block; align-items: inherit; justify-content: inherit; height: auto; position: absolute; left: 5%; bottom: 10%; }
Hope this helps 🙂
-
Hey @otpidusprime
Thank you so much for your help, it works perfectly.
I was wondering if there is a way to fix the following: it doesn’t resize the logo when I make the window smaller, so it remains the same size and then overlaps with the text below and header above.
Thank you!
-
Yes… Try these:
.custom-header-image { min-height: 180px; }
@media screen and (max-width: 59.999em) { .site-logo-link img { max-height: 60px; } }
-
-
- The topic ‘Need my logo to be fixed for all displays’ is closed to new replies.