User: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:

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