Community Forums › Forums › Archived Forums › General Discussion › Atmosphere: Header Height
Tagged: Atmosphere, header
- This topic has 10 replies, 2 voices, and was last updated 7 years, 5 months ago by
Erika.
-
AuthorPosts
-
August 28, 2017 at 11:09 pm #210845
johnpattison
MemberI'm switching over to Atmosphere. I want to keep the Header as text only (like the demo), but the height of my header is significantly taller than the demo. How do I adjust the height of the area...or perhaps get it back to its default, if I somehow changed the height by accident?
Thanks for your help!
http://johnepattison.comAugust 29, 2017 at 7:05 am #210862Erika
ParticipantHi John,
Find this rule in your CSS file and replace it with the one I have below. It will return your main navigation to normal. The parts in bold are what I changed opposed to what you currently have.
.site-header {
background-color: #ffffff;
padding: 0px;
padding: 2rem;
height: 50px;
width: 1140;
overflow: hidden;
}August 29, 2017 at 8:32 am #210866johnpattison
MemberErika,
Thank you so much for weighing in. Unfortunately, that didn't have any discernible effect on the height of the header. That makes me wonder if maybe the issue isn't with the header but with extra padding somewhere else.
John
August 29, 2017 at 9:41 am #210869Erika
ParticipantJohn,
Hmm, the code I gave you makes the header or main navigation look like this:
https://www.risenuponthee.com/reduced-header-height-padding/
Is this the look you were going for? You can also play around with the properties I have in bold to achieve the look you like. One last tip: if you add !important to the end of a property like so: height: 75px !important; it will override other codes that are interfering on most occasions.
August 29, 2017 at 12:09 pm #210879johnpattison
MemberThat's exactly what I want it to look like, Erika. Unfortunately, it still doesn't work, even when I add the "!important" tag.
Is it possible I'm editing the wrong part of the CSS? I'm in the Atmosphere Pro Stylesheet (style.css).
This is what the original looks like:
/* Site Header
---------------------------------------------------------------------------------------------------- */.site-header {
background-color: #fff;
border-bottom: 1px solid #eee;
max-width: 1280px;
min-height: 77px;
padding: 20px 40px;
position: fixed;
width: 100%;
z-index: 999;
}August 29, 2017 at 12:23 pm #210881Erika
ParticipantJohn,
Very strange! I inspected your site's code and took a closer look. It appears you may have custom code inserted that cannot be overridden by the file. Open the Customizer when viewing your site and scroll down to the "Additional CSS" option. See if you have anything in there already regarding the site header. If you do, delete it and replace it with what I gave you. That should fix it! If not... we'll keep brainstorming 🙂 This is certainly fixable somehow.
August 29, 2017 at 12:42 pm #210882johnpattison
MemberI added your code to the Additional CSS section. It made the header somewhat smaller, though probably not as narrow as I'd prefer. It also made the header static, which I'm totally fine with. And it cuts off the bottom of the box around the Newsletter button. I tried experimenting with the height settings on the code you gave me but it doesn't bring the button border back or reduce the height.
I'm really grateful for how generous you're being with your time, Erika. I'm going to look for opportunities to refer people to your services, especially writer friends of mine who want to build a platform.
August 29, 2017 at 1:31 pm #210883Erika
ParticipantThanks John! I appreciate that. I get the feeling that within your theme there are numerous .site-header codes that are conflicting with each other in some way. I may not be able to totally resolve this from the forum. If you don't mind contacting me through my site (linked below) and sharing your login info, I'd be willing to go in and take a look at things myself. I'm confident I can finally resolve this if I do it that way (plus I can make sure things look good and work right on mobile views).
August 29, 2017 at 3:02 pm #210888johnpattison
MemberJust sent an email to the address on your site. Thanks again, Erika!
August 29, 2017 at 5:55 pm #210891johnpattison
MemberErika,
Super grateful that you were able to go in to my site and find all the competing site.header information. The header now looks exactly like how I pictured it in my mind.
Thanks again!
John
August 29, 2017 at 6:40 pm #210892Erika
ParticipantYou are welcome 😉
-
AuthorPosts
- The forum ‘General Discussion’ is closed to new topics and replies.