Question

我正在努力使网络应用程序干净地支持IE8，同时继续支持IE6。 IE8中存在一个已知错误，当表内使用填充时，背景重叠并覆盖表的底部边框。

我正在寻找最干净的解决方法，因为丢失底部边框并不是登录屏幕上的一个选项。

目前我倾向于为css添加一个大纲，因为它只在IE 8中可见，如下所示。我想知道是否有其他人有更好的建议。

（我需要承认我没有Windows ID来检查错误提交，但我可能不得不在家里创建，因为那里可能有东西。）< / p>

table.tblcontentinfo {
  font-family: arial, helvetica, san-serif;
  width: 350px;
/*      outline: 1px solid #336699; */
/* current partial fix  above*/
  border: 1px solid #336699;
  background-color: #FFFFFF;
  margin-left: auto; 
  margin-right: auto;
  margin-top: 60px;
  margin-bottom: 0px;
}

table.tblcontentinfo td {
  padding: 2px;
}

HTML：

<body>
<br />
<br clear="all" />
<div style="margin-top: 120px; text-align: center;">
<div id="realpage" style="visibility: hidden; margin-top: 120px; text-align: center;">
<table class="tblcontentinfo">
<form name="l" id="l" method="post" action="check" autocomplete="off" >
  <tr>
    <td colspan="2" class="bgtitle">&nbsp;<span       class="texttableheader">Title</span></td>
  </tr>
  <tr>
    <td width="125" class="required alignright">Text1&nbsp;</td>
    <td><input name="text1" type="text" class="formfield" size="22" maxlength="8" tabindex="1" /></td>
  </tr>
  <tr>
    <td class="required alignright">Password&nbsp;</td>
    <td><input name="password1" type="password" class="formfield" size="22" maxlength="8" tabindex="2" /></td>
  </tr>
  <tr>
    <td></td>
    <td><input name="Submit" type="submit" class="button" value="Submit" /></td>
  </tr>
</form>
</table>
</div>
<div id="msgpage">
Some text
</div>

</body>

（是的，客户现在正在升级，此时我们只是IE商店，尽管我喜欢浏览器中立的解决方案。）

参考文献： # 50 is the bug I'm trying to workaround IE css support docs (search for outline)

Answer 1

根据您链接中的＃50，您应该可以通过向遇到此问题的元素的CSS添加display: inline-block;来解决这个问题。

Answer 2

我已经获准使用我上面评论过的大纲黑客。看起来我会检查它，因为更糟糕的是它会在功能正常的浏览器下加倍边框宽度。

表中的IE8填充的解决方法导致边框隐藏

2 个答案: