This topic has 12 replies, 3 voices, and was last updated 7 years, 3 months ago ago by Rose Tyler
Hello,
I’m using Xstore Child with header type “Variant Simple”. I’d like the header to be at least 1/3 less in height. Can you help me with CSS for that and tell me where to put it in theme options? Thank you!
Hi,
You have some extra adding for your menu.
I am not sure where did you apply them.
Anyhow add this css code in 8theme options > styling > custom > global custom css
Sorry.. forgot to give the css.
use this css :
.header-simple .menu-wrapper .menu > li > a { padding: 2em 0.77em !important; }
Thank you – it worked! 🙂
What do you mean by “extra adding”, BTW? I have some other custom css, but nothing to do with the menu in the header … ?
PS. Additional question:
My client wishes a fixed header if we succeeded in reducing its height. I have not set it for fixed but the last entry on the menu moves to center during scroll.
Is there anything that can be done about that? (See screenshot in private content)
I mean “I have *now* set it for fixed”. Sorry for the confusing typo.
Absolutely last question for now, I promise:
The header with (hamburger) navigation is too large now on mobile when the page loads, but looks fine when one scrolls down. (See attached screenshots)
What can I do to fix this?
Hello,
Please change previous code to:
.page-wrapper .header-simple .menu-wrapper .menu > li > a {
padding: 2em 0.77em;
}
.fixed-header.header-color-dark .menu li a {
padding: 0.77em 0.7em;
}
.fixed-header > .container {
padding-top: 0px;
padding-bottom: 0px;
}
.fixed-header .navbar-header {
display: none;
}
The header with (hamburger) navigation is too large now on mobile when the page loads, but looks fine when one scrolls down. (See attached screenshots)
– Please provide wp-admin access in Private Content.
Regards
Thank you again! The header looks good now on laptop/desktop!
I’ve provided a guestlogin for you below, for the mobile issue.
Fixed. Please check.
Regards
It is – thank you very much. Quick and efficient support and much appreciated! 🙂
You’re welcome!
Regards
Tagged: header, height, woocommerce, wordpress
The issue related to '‘CSS for reducing header height?’' has been successfully resolved, and the topic is now closed for further responses