一、问题
table在火狐、谷歌都能正常显示,只有在IE中不能显示边框,无论是IE11还是IE8、IE9。如图:
正常情况下:
https://img-blog.csdn.net/20171027151128133?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQveWFuMjYzMzY0/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/SouthEast
IE下:
https://img-blog.csdn.net/20171027151331228?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQveWFuMjYzMzY0/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/SouthEast
二、经过
取消样式中的背景颜色or背景图片就可以正常显示,查看其它样式,都没问题;在table
border-collapse: collapse;
border-spacing: 0;
的样式中,去掉 border-collapse: collapse; 的样式,发现可以出现border,有个问题:border线太粗。。
三、结果
layui样式中有这么一个样式:
.layui-table td, .layui-table th {
position: relative;
padding: 9px 15px;
min-height: 20px;
line-height: 20px;
font-size: 14px;
}
去掉 position: relative; IE8+都可以正常显示border了
四、感想
果然,IE很后妈。。