twitter bootstrap button group with transparent background

Question

I have a button group using twitter bootstrap as you see here:

http://jsfiddle.net/rmk7H/

It makes a linear-gradient background:

linear-gradient(to bottom, #FFFFFF, #E6E6E6)

which is annoying me. I want it to have a transparent background by adding mynav class. How should I modify mynav class?

HTML:

<div class="btn-group mynav">
<a class="btn dropdown-toggle" data-toggle="dropdown" href="#">
Username
<span class="caret"></span>
</a>
<ul class="dropdown-menu">
  <ul class="nav nav-list">
  <li class="nav-header">List header</li>
  <li class="active"><a href="#">Home</a></li>
  <li><a href="#">Library</a></li>
  ...
  </ul>
</ul>
</div>

CSS:

.mynav
{

}

Answer 1

You need to make the background of the a transparent add this

.mynav > a {
    background:none;
    border:none;
    box-shadow:none;
}

http://jsfiddle.net/rmk7H/2/