Sticky (fixed header) overlap top content

Dazzling
1

Hey guys, i saw the sparkling theme can create sticky header/menu:
https://colorlibsupport.com/t/sticky-header/

I tried to apply exactly the same coding listed above on my dazzling theme. Although the sticky header is working, but it overlap part of the slider.

The full image of my slider is:
http://www.moxaherbs.com/wp-content/uploads/2015/09/moxibustion-better-health.jpg

my website is www.moxaherbs.com, as you can see, the head is chopped into half.

I tried put in the #content { margin-top: 44px; }

But doesn’t work.

Any idea?

2

Help anyone?

3

Hi @moxaherbs,

I hope you are well today and thank you for your question.

You can try achieving this by adding the following CSS code in the Custom CSS option of your theme on the below path.

Admin Area -> Appearance -> Theme Options -> Other -> Custom CSS

body.admin-bar div#content {
  margin-top: 114px;
}
div#content {
  margin-top: 80px;
}
body.admin-bar nav.navbar.navbar-default {
  top: 34px;
}
nav.navbar.navbar-default {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 9999;
}

Please remove any other CSS code that you have already used on your site to achieve this.

Best Regards,
Movin