左手's Blog
我是左手，行走在路上!
ie9中border-collapse至box-shadow无法显示的bug
前几天维护公司项目，给一个弹出层添加box-shadow效果，在ie9中效果无法显示，搜索出的结果多为更改doctype声明。页面本身使用html5声明，不存在冲突，调试了半天找出原因，弹出层外框为table默认添加了border-collapse: collapse的样式，因为这个样式导致box-shadow无法生效，修改为border-collapse: separate后解决。
示例代码：
<!DOCTYPE HTML>
<html lang="zh-cn">
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<table style="border-collapse: collapse">
<tr>
<td>
<div style="box-shadow:0 0 50px rgba(0, 0, 0, 0.5); width: 200px; height: 200px; border: 1px solid #CCC;"> </div>
</td>
</tr>
</table>
<table>
<tr>
<td>
<div style="box-shadow:0 0 50px rgba(0, 0, 0, 0.5); width: 200px; height: 200px; border: 1px solid #CCC;"> </div>
</td>
</tr>
</table>
</body>
</html>