Background on menu heading

Comments

• Phil

  March 2022

  Hi,

  Please, go to Appearance -> Menus, choose the menu item to which you want to add the background, and add to it CSS class (you can name it however you want).

  

  After that go to Betheme -> Theme options -> Custom CSS & JS -> CSS, and add to that class the background color attribute.

  

  Thanks

  Learn more: Video Tutorials | How To | FAQ Vote on what comes next
• zech4_6

  March 2022

  Hi Phil,

  Thanks for your response. I tried that, but I get an error. It doesn't accept the class name I entered (I used the same one you did). See attached image.

  Thanks.

  

  
  
• zech4_6

  March 2022

  Ok, I found the mistake, the argument above was missing the '}' bracket so it mess up mine. I did get it to work like you mentioned. However, the background color takes up the whole height of the menu header area (see image below). Is there any way to make this background color smaller, like in the image of my original post/question?

  

  
  
• Phil

  March 2022

  Please, add the "a" and "span" tags to your CSS.

  

  Thanks

  Learn more: Video Tutorials | How To | FAQ Vote on what comes next
• zech4_6

  March 2022

  Thank you, I'll give that a try.

  I do have one more question.

  The menu is justified all the way to the right so that it's right up against the webpage/browser. How can I shift if over to the left about 75px? I can do this when I inspect the element, but can't figure the file or where to make that change? Thank you.

  

  
  
• Phil

  March 2022

  Please, try the following CSS code:

  #Top_bar .menu_wrapper{
     margin-right: 75px!important;
  }
  

  Thanks

  Learn more: Video Tutorials | How To | FAQ Vote on what comes next
• zech4_6

  March 2022

  Thanks Phil, that did it.