网页不是自动换行

Question

我真的很想知道为什么这个web page在我的计算机上不是Firefox，Chrome或IE中的自动换行。我通过萤火虫看了看源头，但无法弄明白。

编辑： 感谢所有答案，我假设添加以下CSS将是解决方案？

pre {
white-space: pre-wrap;
}

Answer 1

简单地说，代码示例包含在<pre>标记中，默认情况下与white-space:pre相同，文本只包含换行符 - 如果删除所有代码示例，则可以看到页面将拉伸正常，滚动条消失。

请参阅此示例。

http://jsfiddle.net/MTdbH/10/

Answer 2

使用预标签和预（格式化文本）以固定宽度字体显示。这也意味着它保留了空格和换行符，因此预标签中的文字太长，推动页面超出了屏幕的限制。

Answer 3

这是因为你的长代码视图

#nav li:hover ul, #nav li li:hover ul, #nav li li li:hover ul, #nav li li li li:hover ul, #nav li.sfhover ul, #nav li li.sfhover ul, #nav li li li.sfhover ul, #nav li li li li.sfhover ul {
    left: auto;
}

我认为这是white-space:pre阻止自动换行。

Answer 4

<div id="content">您遇到问题，因为它没有width。 如果你将宽度设置为这个div（例如500px） - 一切都会好的。 我建议您使用float代替position:absolute进行布局（p id =“logo”，div id =“content”，div id =“nav”）。查看本文http://www.dynamicdrive.com/style/layouts/category/C9/（CSS Liquid Layout＃2.1）