用户:Sky6t/Sandbox/two

one

two

three

"one" and "three" have the same "style" attribute. but the box-shadow cannot be displayed in "one" in Internet Explorer 9 and Internet Explorer 10, in both IE 9 Standards and IE 10 Standards document mode. That is because "one" and "two" are contained in a table which has a "border-collapse:collapse;" style attribute.

Update

It is said that Internet Explorer 10 Release Preview has fixed this bug. Is that true? Yes, it is!!!!

Code below:

1. <div style="font-family:'segoe ui',sans-serif;text-align:center;line-height:30px">
2. <table style="border-collapse:collapse;">
3. <tr style="height:60px">
4. <td style="width:120px">
5. <div style="width:100px;height:30px;box-shadow:5px 5px 10px #ace;border:1px solid #27a">one</div>
6. </td>
7. <td style="width:120px">
8. <div style="width:100px;height:30px;box-shadow:inset 5px 5px 10px #ace;border:1px solid #27a">two</div>
9. </td>
10. </tr>
11. </table>
12. <div style="width:100px;height:30px;box-shadow:5px 5px 10px #ace;border:1px solid #27a">three</div>
13. </div>