FireFox中表格周围的<div>边框问题

Question

FireFox中表格周围的<div>边框问题

我希望这段代码能够在表格周围显示边框.它在Internet Explorer中,但在Firefox中没有.在Firefox中,它在表格上方显示一条水平线.如果我<br />在div中添加任何其他内容,则正确显示边框.如果我删除了align属性,它也可以工作.
这种行为的原因是什么？

<body>  
  <div style="border-style: solid; border-width: 1px;  
    border-color: #A8A8A8; width: 100%">
    <table align="left" cellpadding="0" cellspacing="0" width="100%">
      <tr>
        <td align="center">
          Sample Text<br />
        </td>
      </tr>
    </table>
  </div>
</body>

Run Code Online (Sandbox Code Playgroud)

Answer 1

Que*_*tin 6

该表使用deprecated align属性.这已被CSS float属性取代,并具有相同的效果.

默认情况下,浮动元素不会影响其容器的高度(我相信如果Doctype触发Quirks模式,则在IE中未正确实现此功能,这可能会解释您所看到的渲染的差异.添加触发Doctype的标准模式避免这种情况和浏览器之间的许多其他不一致).

这是因为它们旨在实现如http://complexspiral.com/publications/containing-floats/所示的效果.

有关使容器扩展以覆盖浮动上下文的多种方法,请参见http://www.ejeliot.com/blog/59.我发现溢出:隐藏技术通常是最好的选择.

归档时间：	16 年，5 月前
查看次数：	3726 次
最近记录：	16 年，5 月前