强制div不扩展

Question

我将div设置为宽度60%。我希望在其中嵌套另一个宽度明显更大的div（其中大部分将不会显示）。但是，每当我将子div的大小增加到超过父级的大小时，即使其overflow-x设置为hidden，父级也会扩展为更大的大小。我该怎么做才能解决这个问题？

#parent{
    overflow-y: hidden;
    overflow-x: hidden;
    max-width:60%;
    width:60%;
    display:table-cell;
    border-radius:5px;
    background:#444;
    border-width:10px;
    color:lightgray;
    height:100%;
    padding:1em;
    vertical-align:top;
}
#child{
    width:2000px;
    height:100%;
}

小提琴链接：http://jsfiddle.net/kgsD7/

Answer 1

问题是display:table-cell;

删除它，固定宽度将起作用。

Answer 2

把table-layout：fixed而不是display：table-cell