css - 我的 div 正在突破其容器 div

Question

我有一个不限制其子 div 宽度的包含 div。当我在容器和子项上都设置了宽度时，div 一直延伸到屏幕的整个宽度。为什么会这样。我没有进行任何定位或 float 操作。

请查看我的 HTML:

<ul class="tabs_commentArea">
    <li class=""><a href="#" class="">Starstream</a></li>
    <li class=""><a href="#" class="">Comments</a></li>
</ul>

<div id="paneWrap">
<div class="panes_comments">
    <div class="comments">member pane 1</div>
    <div class="comments">member pane 2</div>
    <div class="comments">member pane 3</div>
</div> 

我的 CSS，至少是它的相关部分:

#MembersColumnContainer {
    width: 590px;
    float: left;
    padding-right: 0px;
    clear: none;
    padding-bottom: 20px;
    padding-left: 2px;
}

ul.tabs_commentArea { 
    list-style:none; 
    margin-top: 2px !important; 
    padding:0;  
    border-bottom:0px solid #666;   
    height:30px;
}

ul.tabs_commentArea li {
    text-indent:0;
    margin:  !important;
    list-style-image:none !important;
    padding-top: 0;
    padding-right: 0;
    padding-bottom: 0;
    padding-left: 0;
    float: right;
}

#paneWrap {
    border: solid 3px #000000;

}

.panes_comments div {
    display: ;
    padding: px px;
    /*border:medium solid #000000;*/
    height:150px;
    width: 588px;
    background-color: #FFFF99;
}

Answer 1

您可以在一个或两个 div 元素上设置 max-width 以防止它们展开:

#containerDiv {
    min-width: 400px; /* prevents the div being squashed by an 'extreme' page-resize */
    width: 50%; /* defines the normal width of the div */
    max-width: 700px; /* prevents the div expanding beyond 700px */
}

也可能是您允许 div 的溢出内容可见，而不是隐藏(或 自动)。但是如果没有您的标记和 CSS 的具体示例，很难猜测。