Archived topic
Float Navigation Logo Outside Container
3 replies · Started by Joseph on April 2, 2021
I apologize for reopening this topic. I tried the CSS on the documentation provided and also some CSS provided by you guys on a recent thread but still cannot get the Navigation Logo to float outside the container.
I have attached the WIP web link for your review.
I followed this link
https://docs.generatepress.com/article/navigation-logo/
Hi Joseph,
It's because you are already using position: absolute; to center the logo.
https://www.screencast.com/t/xpSJ5e6oSM
You could remove the CSS in the green box, and add one line of CSS below to the red box (feel free to adjust the number):
top: 30px;
And you can set logo image size at
Let me know :)
Hi Ying, that did the trick on dropping the image outside the container as needed. I just can't get the image size to 100px in height.
Here is what I used:
.main-navigation .site-logo.navigation-logo img {
height: 100px!important;
}
Let's try this CSS instead:
.navigation-branding img, .site-logo.mobile-header-logo img, .sticky-navigation-logo img {
height: 100px !important;
}