Bootstrap carousel controls not properly clickable in IE9

Created by: Cellcote

So I have included a Bootstrap carousel in my website and I'm creating my own controls for going to the next slide. When I tried to check if the controls were working in IE9, I found something strange. The clickable area for the control was gone. I checked the default controls if the same thing occurred, and it did. To be more concrete, I made some screenshots.

In Safari, Chrome and IE11, this is what's happening and what is desired: Here the red area is the area in which the click will trigger the next slide. The left side is my own control, right side is the default glyphicon.

In IE9, this will happen:

Is there a quick fix for this?