How do I bring my header to the front using CSS?

• 

  designdayze · Member · Jan 16, 2014 at 5:25 am

  • Copy link
  • Add topic to favorites

  I need help with CSS coding to bring my header to the front. It is currently hidden behind the colour #b3b3b3

  The blog I need help with is: (visible only to logged in users)

• 

  hfzrhmn · Member · Jan 16, 2014 at 5:38 am

  • Copy link

  Hey there, your current custom CSS is:

  .site-header {
      background: #b3b3b3;
  }

  Try changing that to:

  .site-header {
      background: #b3b3b3 url(http://designdayze.files.wordpress.com/2014/01/cropped-new-header1.jpg) no-repeat scroll top;
  }

• 

  hfzrhmn · Member · Jan 16, 2014 at 5:40 am

  • Copy link

  Sorry, formatting fail. Try changing your custom CSS to:

  .site-header {
  background: #b3b3b3 url(http://designdayze.files.wordpress.com/2014/01/cropped-new-header1.jpg) no-repeat scroll top;
  }

• 

  designdayze · Member · Jan 16, 2014 at 5:45 am

  • Copy link

  Thanks so much thats great!

  Any chance you also know how I can change the colour of my navigation menu?

• 

  hfzrhmn · Member · Jan 16, 2014 at 5:47 am

  • Copy link

  For navigation menu, try:

  #navbar {
  background: #b3b3b3; // Use your own color here.
  }

• 

  designdayze · Member · Jan 16, 2014 at 5:59 am

  • Copy link

  brilliant thank you! Can I bother you for one more question…

  Can you change the colour of when you hover over the navigation menu catorgories?

  Thank you much appreciated!

• 

  hfzrhmn · Member · Jan 16, 2014 at 6:36 am

  • Copy link

  The hover background color should be this:

  .nav-menu li:hover > a,
  .nav-menu li a:hover {
      background: #b3b3b3; // Use your own color here.
  }

• 

  thesacredpath · Member · Jan 16, 2014 at 6:52 am

  • Copy link

  @hfzrhmn, nice work!

• 

  hfzrhmn · Member · Jan 16, 2014 at 6:53 am

  • Copy link

  @thesacredpath, thanks!

• 

  thesacredpath · Member · Jan 16, 2014 at 7:17 am

  • Copy link

  You are welcome.

• 

  designdayze · Member · Jan 16, 2014 at 9:28 am

  • Copy link

  This has been such a help thank you.

  I also want to change the colour on the navigation bar once you have clicked on the categories. It is currently black. Could you help me with the coding for this?

  Thanks

• 

  hfzrhmn · Member · Jan 16, 2014 at 10:28 am

  • Copy link

  That one should be:

  .nav-menu .current-menu-item > a,
  .nav-menu .current-menu-ancestor > a {
      background-color: #303030; // Your color here
  }

• 

  designdayze · Member · Jan 16, 2014 at 11:02 pm

  • Copy link

  How can I change the colour of the actual text on the navigation menu? As its a really light grey and unreadable?

  Thank you!

• 

  thesacredpath · Member · Jan 17, 2014 at 3:20 am

  • Copy link

  To change the base text color in the menu, add the following and edit the color code as desired.

  .nav-menu li a {
      color: #CCCCCC;
  }

  To change the text color when hovered, add the following and edit the color code.

  .nav-menu li:hover > a, .nav-menu li a:hover {
  color: #CCCCCC;
  }