用户:Sky6t/Sandbox/two
外观
< User:Sky6t | Sandbox
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>