Question

请你帮忙。第一次面对这个问题，需要你的专业知识。

代码是

<div style="overflow:hidden;cursor:pointer;width:100%">
    <div id="ScrBar" style="position:relative;width:16000px">
        This is the text alksdjflask d;alskdj fl;aksjd f;laksdjf l;kasjdf ... -----> long line

    </div>
</div>

这与IE7有关！无法在其他版本的IE上测试。在Chrome和FF中工作正常。

如果我不将DOCTYPE放在html文件的开头，则第一个DIV结束于屏幕的右端，此时内部DIV被“剪切”。没有水平滚动条。

如果我放置DOCTYPE（无论是过渡还是严格），那么外部DIV将获得内部DIV的全宽。窗口有很长的水平滚动条。

嗯，在研究如何解决问题之前，我无法理解问题（就技术术语而言，而不是我在屏幕上看到的内容）。

谢谢！

编辑：进一步的测试表明，使用IE8和本地文件的副本，它会按预期显示，但是当IE8和文件上传到服务器（apache）时，它不会按预期显示长水平滚动条！

Answer 1

省略DOCTYPE会导致浏览器输入quirks mode。 http://webdesign.about.com/cs/doctype/a/aaquirksmode.htm

您应始终至少包含the HTML5 doctype。

Answer 2

请Neils查看此答案。就像马特和其他人提到的那样，你应该总是使用doctype。

“这是IE6和IE7中一个众所周知的错误。要解决它，你需要添加位置：相对于容器。因为在你的情况下，正文是容器，我建议你添加一个div直接在body下面给它position：relative。它应该解决你的问题。“

IE6 + IE7 CSS problem with overflow: hidden; - position: relative; combo

短DIV元素问题中的长DIV元素+ IE7中的DOCTYPE

2 个答案: