Question

这看起来像IE8问题。我有两个并排的div，因为我将其中一个漂浮到左边。但是，如果右侧div内的内容对于窗口来说太大，则右侧div会断开线并进入左侧div。如何使两个div保持在同一水平，并排？

以下是代码：

的CSS：

    <style type="text/css">
    #left_div
    {
        float: left;
        width: 250px;
        height: 400px;
        border: solid 1px red;
    }
    #right_div
    {
        width: 3000px;
        border: solid 1px blue;
    }
</style>

HTML：

    <div id="left_div">
        text in left_div
    </div>
    <div id="right_div">
        text in right_div
    </div>

Answer 1

将float：left添加到right_div。

如果它与Matthew James Taylor和他的Perfect 2 Column Left Menu显示的示例类似，请看看他是如何做的，也许是复制它！

IE过去也有一个问题，就是它的高度和宽度都意味着高度 - 分钟和宽度 - 分钟，因此尽管设置了特定的限制，仍然允许框调整大小。请参阅Webcredible's article，最值得注意的是列表中的第2位！

Answer 2

您还可以向right_div添加至少250px（left_div的宽度）的左边距，这样，right_div旁边的left_div总会有空格。

Answer 3

更改doctype :( IE8需要它才能正确呈现网页）

＆lt;！DOCTYPE html PUBLIC“ - // W3C // DTD XHTML 1.0 Strict // EN”“http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”＆gt;
＆lt; html xmlns =“h t t p：// w w w.w3.org/1999/xhtml”xml：lang =“en-GB”＆gt;

（我用空格编辑了网址，所以不要忘记删除它们:)）

IE8问题：即使它浮动，div也会破坏行

3 个答案: