css - Internet Explorer 忽略显示 :inline

Question

我有一些 Sharepoint 生成的 HTML 标记，它不是您见过的最好的，并且不能干扰标记，但必须通过 CSS 设置样式。

标记大致是这样的:

<div id="searchbox">
<table>
<tr>
<td>
<table class="mstable">
<tr>
<td><input></input></td>
<td><select><option></option><option></option></select></td>
</tr>
</table>
</table>
<div id="fontsize">
<a href=""/>
<a href=""/>
</div>
</div>

这是应用的 CSS

#searchbox {
    float: right;
    margin-right: 15px;
    margin-top: 10px;
    text-align: right;
    width: 40%;
}

#fontsize {
    float: right;
    width: 46px;
}

.mstable {
    border-collapse: collapse;
    margin-left: 2px;
    margin-top: 2px;
    width: 100%;
    color: #000000;
    font-family: Verdana;
    font-size: 0.7em;
    font-style: normal;
    font-weight: normal;
}

我想做的是将 fontsize div 放在表格旁边。目前，在表格之后有一个中断，字体大小 id 在它下面。

我将 display:inline 设置为搜索框和 fontsize div 的所有表后代，在 Firefox 中我得到了想要的结果，但在 IE(所有版本 8 及以下)中它忽略了它..

我知道我的解决方案是删除这些表并使其仅包含 div，但我不知道是否有这种可能性。

编辑:我通过将 float:left 设置为表和 fontsize div 并为表本身设置宽度(以像素为单位)来解决问题，例如限制它扩展到整个搜索框 div。

Answer 1

这应该为你做:

http://jsfiddle.net/nULYR/8/

适用于 ie7+

编辑

<table>
<tr>    // here is 
<td>    // the problem
<table class="mstable">
<tr>
<td><input></input></td>
<td><select><option></option><option></option></select></td>
</tr>
</table>
</table>

与:http://jsfiddle.net/nULYR/13/

没有:http://jsfiddle.net/nULYR/12/