Hi, how can I reduce the space between the header bar and the content below it?
On my computer screen, there’s a good 2 inches of empty space here that doesn’t look right.
Plus, the search bar is partially obscured when opening the site. You have to scroll down to fully see it.
I’d like to shift my content a few inches upward to get rid of the empty space and make sure my search bar is visible without having to scroll down.
Is there any way to do this? Thanks
Hi,
If I understand you correctly please try this CSS snippet:
.site-content {
padding-top: 10px;
}
Please note that you may require additional customizations in the future.
Hi, can you give me a little more info? I tried pasting this css snippet into the additional css box on the home page (after selecting the text at the top). There was no change at all.
Maybe I’m inputting this css snippet in the wrong spot?
Hi,
Please add custom CSS code snippets to the Appearance/Customize/Additional CSS field.
Also, you can check this tutorial How to add custom code snippets - HivePress Help Center
Thanks. I found the area to add the CSS now. However, this is not quite what I wanted. When I add your code snippet, it just moves the search bar up slightly.
But what I’m trying to do is move everything below the header bar up slightly. There is too much space directly after the header bar.
There’s like 2 inches worth of empty space (on my screen) from the bottom of the header bar until the first text.
Hi,
Please provide a link to your site and a screenshot of where you need to hide this space and we will try to help. If you have confidential information on your site, you can send this data to our mail support@hivepress.io
Ok, email sent.
Hi,
Thank you for your email, please try this CSS snippet:
.header-hero {
padding: 0 0 9rem 0;
}
Please note that you may require additional customizations in the future.
Ok, this css snippet completely gets rid of the space, but I want to have some space still (just less than before!)
But altering these numbers in the code doesn’t seem to work.
How can I get something in the middle? Not as much space as the default hivepress theme, but not 0 space like your css snippet?
Please try adjusting the 9rem value (1rem equals to 16px by default, this is the base font size). You can also replace 9rem with a specific pixel value, e.g. 30px.
Hmmm, initially I thought your advice didn’t work. It seems adjusting the 9rem value didn’t help at all (it just moves the search bar up or down). But manipulating the first number with a specific px number seemed to help.
Thank you both for your help. You have solved my problem with the spacing at the top of the site.
How about further down in the site too?
There is too much space between alll the sections. For example, after the search bar until the featured jobs section there is too much space. And after the featured jobs section until the job categories section theres too much space.
What css snippet can i use to reduce the space between each section of the home page?
Hi,
Our team provides a theme with the initial design, as in the demo version, with the same spacing and specific design elements, with the possibility of further customization. Still, it may require additional settings, PHP and CSS tweaks, or third-party plugins.
While we sometimes help with simple snippets, customization is beyond our support scope - it includes fixing bugs and guidance about the available features Support Policy | HivePress
If customizations are required for your site, please try customizing it using the collection of code snippets Search · user:hivepress · GitHub and other developer resources, or consider hiring someone for custom work https://fvrr.co/32e7LvY
Ok, I understand. Thank you
This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.