ng-click doesn't work when the button is floated to the right

Question

Ok this is such a strange one.

I am working in an Angular Project, I have a button with a ng-click attached. It doesn't fire. If I remove the css that floats the button to the right, then it works fine.

HTML:

<button id="btn" ng-click="myFunction()">Name</button>

CSS:

button {
    float: right;
    background-color: green;
    color: white;
}

Javascript / Angular Controller:

app.controller('HomeController', function($scope) {

 $scope.myFunction = function() {
  console.log('Hello World');
 };

});

Simply changing the CSS to:

button {
    background-color: green;
    color: white;
}

Makes it work again

Answer 1

I think when you float it to the right, some other html is on top of your button and it's preventing you from making the click.

Add a z-index: 9999 to your button's css

Hope it helped :)