Drop down menu font color

• 

  katieborowiec · Member · Apr 3, 2017 at 3:59 am

  • Copy link
  • Add topic to favorites

  Newbie here so please go gently on me. How do I change my drop down menu font color? Also, how do I change my font color of my “portfolio” section (about, what to expect, contact/location)? I’m using the Port theme.

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

• 

  otpidusprime · Member · Apr 3, 2017 at 8:55 am

  • Copy link

  Hi there,
  There this CSS code on your site that is applying the black color on all the texts of your site(including the menu and header text of portfolio, about, what to expect, contact page):

  * {
      color: #000 !important;
  }

  Find this code using the CSS editor and change the hex value(#000) to color of your liking.
  FOR EXAMPLE:
  If you want the color to be white, then the CSS code will look like this:

  * {
      color: #ffffff !important;
  }

  If you want to change the paragraph text colors(to white) of the portfolio, about, what to expect, contact pages, etc. then you can do that by adding color property to the CSS of the paragraph like this:

  p {
      line-height: 1.7em;
      font-size: 1em;
      color: #ffffff !important; // add this CSS property
      margin: 0 0 20px 0;
      font-weight: normal;
      font-style: normal;
  }

  And if you want to change the color(to white) of the header text’s of the pages then adding the color property to this CSS:

  .wf-active #page-head h1 {
      font-style: normal;
      font-weight: 400;
      color: #ffffff !important;
  }

  !important is added to force the color into the paragraph, because the above CSS with * is applying the color to every text on the page.

  Hope this helps :)

• 

  katieborowiec · Member · Apr 3, 2017 at 1:31 pm

  • Copy link

  Thank you very much! I added the * code to change all the font to black so it would be easier to see over my images. Are you able to tell me how to change just the drop down menu (actually called menu 1) font color? Or is it easier to change the color background of menu 1? Thanks for patience..

• 

  otpidusprime · Member · Apr 4, 2017 at 7:25 am

  • Copy link

  To just change the font color of the menu 1, change the color CSS property of this code:

  #slide-nav #main-nav li a {
      color: rgba(255,255,255,.5);  // change this
      font-weight: bold;
      -o-transition: .5s;
      -ms-transition: .5s;
      -moz-transition: .5s;
      -webkit-transition: .5s;
      transition: .5s;
      transition-property: color;
  }

  to have a value like this:

  #slide-nav #main-nav li a {
      color: #ffffff !important;  // to this
      font-weight: bold;
      -o-transition: .5s;
      -ms-transition: .5s;
      -moz-transition: .5s;
      -webkit-transition: .5s;
      transition: .5s;
      transition-property: color;
  }

  Let me know if it works :)

• 

  katieborowiec · Member · Apr 4, 2017 at 5:02 pm

  • Copy link

  Thank you so much otpidusprime! That worked to change the font color! Someday I hope to speak code…. Have a great week and I’m sure you’ll see another question from me soon.

• 

  otpidusprime · Member · Apr 4, 2017 at 5:34 pm

  • Copy link

  Don’t worry @katieborowiec, keep practicing-you will be a pro at coding one day, and sure – don’t be afraid to ask questions, we are all here to learn after all.

  You’re Welcome and All the best :)