bootstrap-theme.css: Button corners look funny in IE9 due to gradient filter

Created by: arechsteiner

Code snippet:

<link href="css/bootstrap.css" rel="stylesheet" media="screen">
<link href="css/bootstrap-theme.css" rel="stylesheet" media="screen">
...
<button type="submit" class="btn btn-success">Submit</button>

Result in IE9 (magnified):

I'm not entirely sure what causes this bug. But I think it has something to do with the IE gradient filter called by the mixin .btn-styles(@btn-color: #555;) in theme.less, which then calls the vertical gradient mixin, with this attribute:

filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",argb(@start-color),argb(@end-color))); // IE9 and down

When I comment this filter, then the button has rounded corners (but lacks gradient obviously). But then again, I think the same filter was used in Bootstrap 2.3 and there it works fine.