Make the header height smaller than the default? When I change the header padding, I can make the header height larger, but I want to make the header height smaller. If I put a negative value for header padding then the text and logo aren't centered in the header and it looks funny.
Make the header dropdown width smaller? I feel that it is too wide.
I am trying to make my header smaller than my logo so my logo overlaps over it. Is this possible with a custom code? Ive tried entering a negative number in the header padding section with no luck. I'll attach an image for reference so you can see what I am looking for. Thanks in advance for your time and help.
Add this into the Custom CSS box located in your Salient Options panel (All custom css provided is tested in the Live Browser so it will work as intended . If you cant see any changes make sure there is no red cross in the Custom CSS Box as that syntax error would cause all css below it to not show up on the Frontend):
I appreciate you taking the time to help me out. So Ideally I would like the header to be about 55 px wide and the logo to be about 85px so that about 15px of the logo hangs over the header on top and bottom. Using the custom CSS code you provided, I was able to get the look I desire at the bottom of the header but it added space to the top (screenshot attached below). I would like to remove that space at the top of the header so the logo can hang over onto the secondary menu. Ive attached a screenshot of another website with their header similar to how I want for reference.
I also noticed that the custom CSS made my logo very small on the mobile view (screenshot attached below) so I would like to fix that if possible as well. Thanks for your time and help.
I tried but I think my support time recently expired. The URL is https://theheady.wpengine.com/ but I'll just keep trying I suppose. Thanks for your help.
I think Im getting close to what I'm looking for. Now I would just like to have the logo appear on top of the secondary nav rather than below it as well as fix the gap that occurs above my logo on the mobile view. Thanks so much for your help!
Add this into the Custom CSS box located in your Salient Options panel (All custom css provided is tested in the Live Browser so it will work as intended . If you cant see any changes make sure there is no red cross in the Custom CSS Box as that syntax error would cause all css below it to not show up on the Frontend):
div#header-outer {
z-index: 99999;
}
@media only screen and (max-width: 1000px) {
body header#top #logo img, #header-outer[data-permanent-transparent="false"] #logo .dark-version {
top:0px !important;
}
}
How do I adjust the following:
Thank you!
Hey Again,
1: Try adding 1 as header padding and check .
2: Add this into the Custom CSS box located in your Salient Options panel (Make Sure there are no red cross in the Box) :
.sf-menu ul { width: 13em !important; }
Best.
ThemeNectar Support Team
Hello,
I am trying to make my header smaller than my logo so my logo overlaps over it. Is this possible with a custom code? Ive tried entering a negative number in the header padding section with no luck. I'll attach an image for reference so you can see what I am looking for. Thanks in advance for your time and help.
@Andrew,
Add this into the Custom CSS box located in your Salient Options panel (All custom css provided is tested in the Live Browser so it will work as intended . If you cant see any changes make sure there is no red cross in the Custom CSS Box as that syntax error would cause all css below it to not show up on the Frontend):
header#top #logo img { height: 50px !important; position: relative; top: -10px !important; }Thanks
ThemeNectar Support Team
Hello,
I appreciate you taking the time to help me out. So Ideally I would like the header to be about 55 px wide and the logo to be about 85px so that about 15px of the logo hangs over the header on top and bottom. Using the custom CSS code you provided, I was able to get the look I desire at the bottom of the header but it added space to the top (screenshot attached below). I would like to remove that space at the top of the header so the logo can hang over onto the secondary menu. Ive attached a screenshot of another website with their header similar to how I want for reference.
I also noticed that the custom CSS made my logo very small on the mobile view (screenshot attached below) so I would like to fix that if possible as well. Thanks for your time and help.
@Andrew, Please create a new ticket with the page url so we can have a look .
Best
ThemeNectar Support Team
I tried but I think my support time recently expired. The URL is https://theheady.wpengine.com/ but I'll just keep trying I suppose. Thanks for your help.
I dont see any Purchase code added either ? .
ThemeNectar Support Team
I added the purchase code when I tried to start a new ticket but it says my support has expired.
8e93a699-9c7f-48f8-9e06-d7454e68bcac
I understand if you aren't able to assist further however any help would be greatly appreciated.
There is a user pass set on the url ?
ThemeNectar Support Team
Sorry I forgot about that.
username: demo
PW: demo24
I think Im getting close to what I'm looking for. Now I would just like to have the logo appear on top of the secondary nav rather than below it as well as fix the gap that occurs above my logo on the mobile view. Thanks so much for your help!
Add this into the Custom CSS box located in your Salient Options panel (All custom css provided is tested in the Live Browser so it will work as intended . If you cant see any changes make sure there is no red cross in the Custom CSS Box as that syntax error would cause all css below it to not show up on the Frontend):
div#header-outer { z-index: 99999; } @media only screen and (max-width: 1000px) { body header#top #logo img, #header-outer[data-permanent-transparent="false"] #logo .dark-version { top:0px !important; } }Thanks
ThemeNectar Support Team