Eventbrite single theme main menu bar

• 

  lythamanne · Member · Apr 19, 2015 at 12:16 am

  • Copy link
  • Add topic to favorites

  Hello,
  I have just started a new blog with the Eventbrite single event theme. I have a large header picture, and the Menu bar, which currently just has the About page name on it, is large with a black background and obscuring my nice header. Is there a way of making the background of the menu bar invisible? I haven’t purchased the CSS upgrade yet, I am asking if this is possible before I do that.

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

• 

  thesacredpath · Member · Apr 19, 2015 at 6:00 pm

  • Copy link

  Hi, the following will do it, but due to the nature of your image, when you add additional menu items that approach the center of the header image, your menu items will be very hard to read because of the light color.

  nav, div.menu {
      background: none;
  }
  nav a, div.menu a {
      background: none;
      border-bottom: none;
  }

  I might suggest trying the following instead, which puts a transparent black background to the menu and then when a menu item is hovered, it becomes slightly darker as a visual indicator to the visitors. See what you think.

  nav, div.menu {
      background: rgba(0, 0, 0, 0.3);
  }
  nav a, div.menu a {
      background: none;
      border-bottom: none;
  }
  nav a:hover, div.menu a:hover {
      background: rgba(0, 0, 0, 0.5);
  }

• 

  lythamanne · Member · Apr 19, 2015 at 7:18 pm

  • Copy link

  O.K I’ll try that. Thanks very much.

• 

  thesacredpath · Member · Apr 21, 2015 at 1:56 am

  • Copy link

  You are welcome.