这在chrome中工作正常，但IE不喜欢它并破坏了内容主div。检查word-wrap: break-word，如此处所述空白：nowrap 在水平滚动框中的 IE 中不起作用，但我在任何地方都没有。
这是一个小提琴 http://jsfiddle.net/02hgaahe/尽管IE中的小提琴显示正确....奇怪。
这是我的代码。
.HTML-
/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/*
Created on : Jan 7, 2015, 2:31:39 PM
*/
body {
font-family:arial,helvetica,sans-serif;
font-size:12px;
}
#wrapper {
margin:0px auto;
border:1px solid #bbb;
padding:10px;
height: 90%;
}
#header {
border:1px solid #bbb;
height:80px;
padding:10px;
}
#header > #content-main{
width:200px;
height:80px;
border: 1px solid #bbb;
}
.content {
margin-top:10px;
padding-bottom:10px;
white-space: nowrap;
overflow-x: visible;
overflow-y: hidden;
height:320px;
}
.content div {
border:1px solid #bbb;
}
.content-main {
display: inline-block;
width:500px;
height:300px;
}
#footer {
margin-top:10px;
padding:10px;
border:1px solid #bbb;
}
#bottom {
clear:both;
text-align:right;
}<div id="wrapper">
<div id="header">Header</div>
<div class="content">
<div class="content-main">Left</div>
<div class="content-main">main</div>
<div class="content-main">right</div>
<div class="content-main">right</div>
<div class="content-main">right</div>
<div class="content-main">right</div>
<div class="content-main">right</div>
<div class="content-main">right</div>
<div class="content-main">right</div>
</div>
<div id="footer"></div>
<div id="bottom"></div>
</div>编辑：删除了重复的ID和不正确的注释。
不过，它仍然显示不正确。
编辑：我认为问题出在Internet Explorer对内部网站的兼容性设置上，我不知道IE将所有内部站点默认为兼容模式（基本上是IE7）。
是时候在黑暗中拍摄了！
你还记得 HTML 文件开头的<!DOCTYPE html>吗？没有它，较旧的IE版本将默认为Quirks模式，在CSS方面可能无法正常工作。
我相信
这里的问题是你正在使用重复的id。
如果要将一个div的效果"复制"到另一个div上，请尝试改用类。
使用类使"类"可重用，这与使用"id"不同，"id"应该是唯一的，而不是重复的。复制ID会导致各种有趣的错误/故障。
像这样：
body {
font-family: arial, helvetica, sans-serif;
font-size: 12px;
}
#wrapper {
margin: 0px auto;
border: 1px solid #bbb;
padding: 10px;
height: 90%;
}
#header {
border: 1px solid #bbb;
height: 80px;
padding: 10px;
}
#header > #content-main {
width: 200px;
height: 80px;
border: 1px solid #bbb;
}
#content {
margin-top: 10px;
padding-bottom: 10px;
white-space: nowrap;
overflow-x: visible;
overflow-y: hidden;
height: 320px;
}
#content div {
/*padding:10px;*/
border: 1px solid #bbb;
}
.content-main {
display: inline-block;
width: 500px;
height: 300px;
}
#footer {
margin-top: 10px;
padding: 10px;
border: 1px solid #bbb;
}
#bottom {
clear: both;
text-align: right;
}<div id="wrapper">
<div id="header">Header</div>
<div id="content">
<div class="content-main">Left</div>
<div class="content-main">main</div>
<div class="content-main">right</div>
<div class="content-main">right</div>
<div class="content-main">right</div>
<div class="content-main">right</div>
<div class="content-main">right</div>
<div class="content-main">right</div>
<div class="content-main">right</div>
</div>
<div id="footer"></div>
<div id="bottom"></div>
</div>作为旁注，正如@James所说，css 中的注释看起来像/*comment*/而不是//comment