Material: checkbox: not showing tick mark when in a table with border-collapse in IE 11

[Purushothama-VS]

Actual Behavior:

• md-checkbox is not showing tick mark in IE 11 browser
• md-checkbox should show tick mark in IE 11 browser?

CodePen (or steps to reproduce the issue): *

• CodePen Demo which shows your ``issue: <div ng-repeat="userrole in userManager.UserRoles"> <md-checkbox class="md-primary" ng-model="userrole.Value" ng-true-value="'true'" ng-false-value="'false'"> <span> {{ userrole.RoleName }}</span> </md-checkbox> </div>
  This issue is not reproducible in firefox and chrome.
• Details:

Angular Versions: *

• 1.5.8:
• Angular Material Version:1.1.3

Additional Information:

• Browser Type: IE *
• Browser Version: 11.0.96*
• OS: Windows*
• Stack Traces:

---

Shortcut to create a new CodePen Demo.
Note: * indicates required information. Without this information, your issue may be auto-closed.

Do not modify the titles or questions. Simply add your responses to the ends of the questions.
Add more lines if needed.``

[EladBezalel]

Please provide a codepen so we can investigate further.

[Gokul6446]

Refer this Link : https://jsfiddle.net/a8zco7nt/11/
For both IE & EDGE

[Splaktar]

Is this what you are seeing? This is a screenshot from Edge and I'm seeing the same on IE11 (using this CodePen, in debug view, since JSFiddle does not support IE11).

It seems to be caused by the border-collapse: collapse; styling. I'm not yet sure why.