Website Body CSS

Support
#1

Hello, on my Home Page and About Page, the body is moved up to where it doesn’t show the drop shadow below my header ( that you can see on my other pages such as categories ). Is their any CSS that would be able to fix this without messing up any of the content for mobile view? Thanks!

#2

Hi There,

Thanks for writing in!

To resolve your issue,

@media (min-width: 980px) {
  header.masthead.masthead-inline {
    position: relative;
    z-index: 999;
    margin: 0 auto;
  }

  .x-slider-container {
    z-index: 998;
  }

  .rev_slider.fullwidthabanner.revslider-initialised.tp-simpleresponsive.rev_redraw_on_blurfocus {
    margin-top: 0 !important;
  }
}

Please let us know how it goes.

#3

Hello,

That code worked for my homepage, but my about page is still not in sync. Also, it eliminated the headers shadow for mobile and tablet view. How should I fix this?

#4

Hey There,

If you want to include the mobile and tablet view, please use this code instead:

header.masthead.masthead-inline {
    position: relative;
    z-index: 999;
    margin: 0 auto;
  }

  .x-slider-container {
    z-index: 998;
  }

  .rev_slider.fullwidthabanner.revslider-initialised.tp-simpleresponsive.rev_redraw_on_blurfocus {
    margin-top: 0 !important;
  }

Please do not forget to clear your plugin cache and browser cache first before testing the site.

#5

Okay that’s great! One more thing, the header it self is now bigger, anyway to shrink the white space on the top?

#6

Hey There,

That is because of this code:

.rev_slider.fullwidthabanner.revslider-initialised.tp-simpleresponsive.rev_redraw_on_blurfocus {
    margin-top: 15px !important;
}

Did you added this code? Please remove it.

#7

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.