- This topic has 10 replies, 2 voices, and was last updated 4 years, 10 months ago by
.
Hi!
I found a topic with the same question but it doesn’t work for me. It’s probably because it was posted 2 years ago.
So… I have a big white space between header navigation and content. And it’s even bigger when viewing my site on my phone. What can I do? I can’t find any padding options within theme customizer.
Thank you very much!
Solution for this topic
Hi @siminator,
I hope you are well today and thank you for your question.
You can remove the white space as described in the below topic.
https://support.shufflehound.com/forums/topic/white-space-below-the-menu-header/#post-47826
Best regards,
Shufflehound teamWell the problem is that I don’t find “Section” that it’s shown on that printscreen you attached in that topic.
So I tried CSS code below which worked well – it reducee space between header navigation and title bar. But what about space between title bar and content (the code below works for a homepage but not for other pages, blog posts, etc.)?
body.home #wrapper > .sh-page-layout-default {
padding-top: 0px;
}Somehow I found out how to make white space smaller on all parts of my website (I just changed a word “home” with words like “single-post”, “page” etc). However, this only applies when visiting my site via PC. On mobile phone the problem is still there.
Could you please share me your site URL where it’s displaying so that I can help you to achieve it?
Also, please try using the below CSS code.
#wrapper > .sh-page-layout-default { padding-top: 0px; }Still doesn’t work. My url is http://www.blebetac.si (it is not online yet).
That white space is especially huge when viewing my site on mobile phone – between header navigation and title bar (or content, depending if I will actually use titlebar or not).
Thank you!
I have a few more questions that are not linked to this topic. And because I don’t want to be annoying by opening a new ticket for every question, I hope you don’t mind posting it here.
So…
1. How can I change a color of social icon background (within widget)? I found here on this forum a CSS for changing colors of social icons but not for changing background color and background color when hover.
2. In my header menu I have a menu item that I made it unclickable (when you scroll on it, a few more clickable items appear below). However, when I use titlebar, that ubclickable item is actually clickable as a breadcrumb. It’s a bit frustrating since there is no content inside.
Thank you very much for your answers and I hope I’m not asking too many questions.
Solution for this topic
You can remove the space displayed on mobile by using the below CSS code.
header.primary-mobile { max-height: 125px !important; }To help us keep support thread separates could you please create a new thread for each of your other questions instead of asking them in your single thread as it makes the thread messy and hard to read.
If you want to you can also add reference of this thread in your newly created thread.
We would be more than happy to help you with your new thread.
It works! Thank you!
Okay no problem I will open a new topic for each question.
You are most welcome 🙂
