ATTENTION, PLEASE READ: New topic creation is disabled, as we have moved to a new support system. Your existing topics will remain, but for all new requests you will need to use the new system. Click here to go to the new support request form.

• Back to forum

  Posted in: Dante
• June 26, 2015 at 9:49 am #188935
  solidsn2004

  Member

  Post count: 208

  Hi,

  I am working on a testing site and I have set the navigation menu background to a green color with code: #347a49 and white text. I have also enabled the sticky header but when I scroll down my page the navigation bar becomes white.

  Is there a way to change this from the customize option of the theme or I need to use CSS code?

  Thanks in advance.

  June 26, 2015 at 10:41 am #188966
  Kyle – SUPPORT

  Moderator

  Post count: 35880

  Hi

  Try this:

  #header-section::before, #header .is-sticky .sticky-header, #header-section .is-sticky #main-nav.sticky-header, #header-section.header-6 .is-sticky #header.sticky-header, .ajax-search-wrap {
    background: #347a49!important;
  }

  – Kyle

  June 26, 2015 at 11:00 am #188982
  solidsn2004

  Member

  Post count: 208

  Hmm thanks Kyle but now the whole header turns green (see image)…

  I want the header white with only the nav bar to be green and when scrolling down the menu to turn green.

  Attachments:

  You must be logged in to view attached files.
  June 26, 2015 at 11:14 am #188998
  Kyle – SUPPORT

  Moderator

  Post count: 35880

  Ok remove that css and just use this:

  #header-section .is-sticky #main-nav.sticky-header {
    background: #347a49!important;
  }

  – Kyle

  June 26, 2015 at 11:15 am #189000
  Nishant – SUPPORT

  Spectator

  Post count: 649

  Hi,

  Please please replace the above code to this

  div#main-nav.sticky-header {
    background-color: #347a49;
  }

  this will make only the navigation green even on scroll down

  Thanks,
  Nishant

  June 26, 2015 at 11:31 am #189010
  solidsn2004

  Member

  Post count: 208

  Thanks for the suggestion Nishant.

  I had used the code you provided and added !important; as well but it didn’t work.

  Kyle’s suggestion worked fine!

  Thanks to both of you!!!
  Now it’s resolved.

  June 26, 2015 at 11:40 am #189017
  Kyle – SUPPORT

  Moderator

  Post count: 35880

  Ok great 🙂

• Back to forum

  Posted in: Dante