Layerswp (Free version) CSS for header bar custom height
Hi ,
In the css tab add the following code :
.header-site .container { height: 50px; }
Change height to what you want for example the 28px.
this includes the container selector
when you do it without and only .header-site
the header text ( logo and menu) won’t scale with it.
-Dieter
The header height is determined by your logo height. By default this is maxed to 80px to support a sticky header, with a line height/default font size amounting to roughly 40px. The rest is padding (20 above and 20 below). The following explains how to manipulate the logo with or without Layers Pro: https://docs.layerswp.com/doc/how-to-make-the-logo-bigger/
28px may not be tall enough to support the menu properly or several extensions that add stuff to the header so keep that in mind if you are making this modification to a commercial child theme. Because the header has 40px of padding by default, the first thing you need to do is reduce that to more like 4px, then set the actual height to 20px.
You can find further resources for customizing the header here: