AngularJs dropdown menu-content covering menu button
<p>My dropdown menu content is covering up my dropdown button, any idea how to fix it? I want it to appear directly underneath my dropdown button. I have tried creating a class and style it in CSS as "position: absolute;" but it doesn't work. 
Here is my code in angular:</p>

<pre><code>&lt;div ng-controller="Ctrll" ng-app="Fruit"&gt;

  &lt;div&gt;
    &lt;md-menu&gt;
      &lt;md-button ng-click="$mdOpenMenu()"&gt;Fruits
      &lt;/md-button&gt;
      &lt;md-menu-content class="dropdown" &gt;

         &lt;md-menu-item &gt;
                        &lt;md-button ng-click="apple()"&gt;Apple&lt;/md-button&gt;
                        &lt;/md-menu-item&gt;
                        &lt;md-menu-item&gt;
                        &lt;md-button ng-click="blueberry()"&gt;Blueberry &lt;/md-button&gt;
                        &lt;/md-menu-item&gt;
       &lt;/md-menu&gt;
      &lt;/md-menu-content&gt;    
  &lt;/div&gt;
&lt;/div&gt;
</code></pre>

<p>here is my Angular app</p>

<pre><code>angular
  .module('Fruit',['ngMaterial'])


  .controller('Ctrll', function () {
    var originatorEv;

    this.openMenu = function($mdOpenMenu, ev) {
      originatorEv = ev;
      $mdOpenMenu(ev);
    };
});
</code></pre>

<p>I have added it to codepen. Here is how my code looks like in action. <a href="http://codepen.io/zcook/pen/YqramL" rel="nofollow noreferrer">http://codepen.io/zcook/pen/YqramL</a></p>

<p>Also, does anyone know how to change the color of the background of the dropdown menu content?</p>