Question

我有一个有两列的表。左列有一些内容和一个小部件div，它是唯一的浮动元素。当页面加载时，此div将继续移动到页面底部，并使用表格的右列。当我悬停某些东西时，它有时会向后移动，它似乎是完全随机的。

似乎是IE浏览器偷看但不完全。我试过了position: relative;，但它不起作用。有什么想法吗？

这是html：

<table class="formTable">
    <tr>
        <td class="content_main">
            <h1>header</h1>
            <table>
                <tr>
                    <td>Content here</td>
                    <td>Content here</td>
                </tr>
            </table>

            <div style="float: left; clear: none; display: block; color: rgb(68, 68, 68); font-weight: normal; font-family: &quot;Trebuchet MS&quot;,&quot;Verdana&quot;,sans-serif; font-size: 14px; line-height: 18px; text-decoration: none; text-align: left; margin: 0px; padding: 10px; height: auto; width: auto; background-image: none; background-color: white; border: 10px solid rgb(204, 204, 204); overflow: auto;" id="widget">
                Content
            </div>
        </td>
        <td class="content_right">
            <ul>
                <li>List</li>
                <li>List</li>
            </ul>
        </td>
    </tr>
</table>

这是桌子的css：

.content_right {
    padding-left: 20px;
    padding-top: 15px;
    width: 393px;
}
.content_main {
    padding-top: 15px;
    width: 500px;
}

Answer 1

对我来说很好。如果您知道如何使用div，请避免使用表格。

Answer 2

        <h1>header</h1>
        <article>Content here</article>
        <article>Content here</article>

        <div id="widget">
            Content
        </div>
        <ul>
            <li>List</li>
            <li>List</li>
        </ul>

尝试这样的HTML，并使用CSS样式表而不是内联blob。标准是有原因的。到目前为止，所有最近的浏览器都支持它们，不再需要蹩脚的标记和它引起的“错误”。有关阅读材料，请参阅http://www.abookapart.com/。

Div在IE中移动

2 个答案: