button only clickable on lower half html

Question

I have two buttons on my web page and they are only clickable on the lower half of them. I saw this post Anchor working only in the lower half of the button , but the solution was to change the styling on them. I don't have any styling on mine.

The buttons:

  div.buttons{ text-align: center; } 

  <div class="buttons"> <button type="button" ng-click='test()' class="btn btn-success" ng-disabled="testactive">Run Test</button> <button type="button" ng-click='stoptest()' class="btn btn-success" ng-disabled="testinactive">Stop Test</button> </div> 

Answer 1

Well, normally when we use button tag or hyperlink tag its line-height is fine as default.

But when we add some style and font size some big or small then we need to set line-height ...

button{font-size:20px; line-height:30px;}

it will be working fine.

So try it and I am sure it will be useful.

Thanks

Answer 2

instead try this

replace button as input

<div class="buttons">
         <input type="button" ng-click='test()' class="btn btn-success" ng-disabled="testactive">Run Test</button>
         <input type="button" ng-click='stoptest()' class="btn btn-success" ng-disabled="testinactive">Stop Test</button>
    </div>