Need Help with Responsive Theme – WordPress 3.9

Hey,

This can easily be done with custom CSS. Here is the code for you

/*Changes the menu background color and align menu to the right*/

.menu {
   background-color: #85abff;
   background-image: none;
   text-align: right;
}

/*Overrides the themes default settings to make sure the menu aligns right */

.menu li {
  display: inline-block;
  float: none !important;
}

/*Changes link color */

.menu a {
  color: #ffffff;
}

You can adjust the menu background to whatever color you like.

Important: Just copy and paste this code into the bottom of your Custom CSS or Child Theme style.css so that you won’t lose your changes once you update your theme in the future. A Child Theme is the safest and best way to go when doing all kinds of modifications.

I hope this helps. ??

Onwards and upwards,
-Trey

@DesignByTrey:

Thanks so much for your response. The menu floated to the right (thanks!) Could you suggest code for changing background color to white while also changing text color of menu to charcoal/grey? (keeping in mind, currently, text color of menu is white). Though I was able to change background of menu to white, I wasn’t able to successfully change text to menu from white to grey.

Again any assistance is much appreciated.
C

Hey,

Just change the #ffffff to something like #333333 and that will give you a nice grey color. To find your perfect color, you can always use THIS WEBSITE. Just select the right color and copy and past the code in the custom code that I gave you

Cheers!
-Trey

@DesignByTrey:

Thanks so much. A couple more things,

1) How do you get rid of vertical borders (black) between menu items?
2) How do you ensure all background – when hovering over menu – stays default gradient grey? (currently, when hovering, it is mostly the default gradient grey but also has bits of white on side)

Thanks in advance,
C

Could I have the link to your website so that I can take a look at what is going on exactly. Therefore, I could better assist you.

-Trey

Hi Trey,

It’s actually under construction, but will get it off so you can assess
https://picneewatch.com

Thanks in advance,
C

Hey,

Just add this code and it will take care of it:

.menu a {
  border-left: none;
}

-Trey

Also, this code is needed to align your sub-menu:

.menu li li {
  display: block;
  text-align: left;
}

@DesignByTrey:

Thank you so much; worked like a charm!

My pleasure! Glad I could help. ??

Make sure you mark this topic as “resolved” so that others know.

Cheers!
-Trey

Will do; thanks again Trey!