ie7浮动表左侧行不起作用答案

【问题标题】：ie7 float table row left isn't workingie7浮动表左侧行不起作用
【发布时间】：2012-07-29 00:42:17
【问题描述】：

我正在处理一个无法编辑的表格，我无法添加任何 HTML，我无法添加任何 JS。一切都已预先生成，我所能做的就是向其中添加 CSS。

所以表格有 2 行，一是侧边栏，二是中心内容。我想将侧边栏设为 210px 宽并将其向左浮动，就像我将内容居中一样。除了 IE7，所有浏览器都可以正常工作。当我使用 IE7 开发者工具检查它时，我可以看到它下面的行和 TD 总是 100% 宽，并且无法为其分配宽度值。

这个问题有解决办法吗？

示例代码。

<table>
<tr id="sidebar"><td>Some data</td></tr>
<tr id="main"><td>Some data 2</td></tr>
</table>

CSS:
#sidebar
{
display:block;
width:210px;
float:left;
}
#main
{
display:block;
width:730px;
float:left;
}

请指教

【问题讨论】：

试试display: inline-block; zoom: 1; *display: inline;。
我没听懂这个问题，你是要指定宽度还是要除第一个 td 之外的第二个 td？
我希望一个 tr 紧挨着另一个。出于某种原因，它们的宽度是 100%，而不是我所说的那样。
@bobek 我有完全相同的问题 - 无法编辑标记，但需要将第二个 tr 浮动到第一个 tr 的右侧 - 但在 ie7 中遇到问题。你找到解决办法了吗？
不，我没有 - 很抱歉，我认为这不可能。

标签： html css internet-explorer-7

【解决方案1】：

我没有ie7，但是设置行显示：table-cell;在这个例子中，在桌子上放一个宽度在 chrome 中工作。 http://jsfiddle.net/jalbertbowdenii/7Wuku/

【讨论】：

单元格在 IE7 中显示 1 在另一个下方
嗯。您是否设置了适当的宽度以考虑边距或填充？
@albert，你可以使用任何你想要的显示，但如果你以后使用float: left 或正确的 - 这样一个元素的计算样式将是display: block - 尝试检查一个浮动元素，你'将看到 display: whatever_you_may_put_here 属性从未应用
是的，如果您想在 IE 中使用开发人员模式并将其渲染为版本 7 并查看
你可以在 ie8 中使用绝对定位和丑陋的文本对齐来做到这一点；再说一次，我没有 ie7，所以我不是 100% 这会起作用，但试试看，让我知道：jsfiddle.net/7Wuku/3

【解决方案2】：

我认为最好的方法是不使用第二行...当然，如果您可以像这样进行标记：

<table>
    <tr>
        <td id="sidebar">Sidebar content</td>
        <td class="main_cont">Main content</td>
    </tr>
</table>

在此标记中，您不需要浮动tds，只需说明宽度即可。一个活生生的例子在这里：http://jsfiddle.net/skip405/QySz2/1/

但如果你不能改变标记 - 恐怕你永远不会教 IE7 浮动表格行））

【讨论】：