我读过相当 一个 几个 类似的 问题，给我的，但没有一个是完全一样或具有适用于我的答案。
我正在使用Twitter Bootstrap3。我有两行，每行包含一个col-sm-12div，因此它们的宽度相同。第一行中的内容比其容器宽，但我overflow:auto在包含两行的元素上进行了设置，因此显示了水平滚动条，可以使用该内容看到内容，这很好。
在第二行中，我有一个div，我要向其应用jQuery插件（jqxGrid，这是值得的）。我已将width插件的选项设置为“ 100％”。结果网格的内容对于容器来说也太宽了，但是由于jQuery插件创建网格的方式，它将网格的宽度限制为其父对象宽度的100％，而不是溢出。
因此，我真正需要的是.row所有元素都与最大溢出内容一样宽，以便当jQuery插件评估其父对象的宽度以设置其自己的宽度时，最终的网格最终将与溢出内容一样宽第一行中的内容。
我做了一个小提琴，希望能说明这个问题。我觉得这本质上是CSS问题，因此纯CSS解决方案会很出色，但是我怀疑这样做是否可行。
.wrapper {
color: #fff;
padding: 10px;
}
.container-fluid {
background-color: #333;
overflow: auto;
}
.row1 {
background-color: yellow;
}
.row2 {
background-color: orange;
}
.short-content {
background-color: red;
width: 100%;
}
.long-content {
width: 2000px;
background-color: blue;
}<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<div class="wrapper">
<div class="container-fluid">
<div class="row row1">
<div class="col-sm-12">
<div class="long-content">
Long content
</div>
</div>
</div>
<div class="row row2">
<div class="col-sm-12">
<div class="short-content">
THe jQuery plugin here is too wide to fit but won't overflow because its width is set to match its parent.
</div>
</div>
</div>
</div>
</div>据我了解，将每个包装.col-sm-12到自己的父母中.row是一种冗长的方式，将所有包装.col-sm-12在一个.row容器中，因为.col-sm-12s总是包装在新行中。
因此，如果您的设置允许删除中间.row标记，那么您必须编写的css唯一额外的行是float: left;on .row。（在下面我的例子中使用的ID#custom上.container-fluid，从您的网页中，这家修改隔离）。
body {
color: #fff;
padding: 10px;
}
.container-fluid {
background-color: #333;
overflow: auto;
}
.row1 {
background-color: yellow;
}
/*.row2 {
background-color: orange;
}*/
.short-content {
background-color: red;
width: 100%;
}
.long-content {
width:2000px;
background-color: blue;
}
#custom .row {
float: left;
}<div id="custom" class="container-fluid">
<div class="row row1">
<div class="col-sm-12">
<div class="long-content">
Long content
</div>
</div>
<!-- </div> -->
<!-- <div class="row row2"> -->
<div class="col-sm-12">
<div class="short-content">
THe jQuery plugin here is too wide to fit but won't overflow because its width is set to match its parent.
</div>
</div>
</div>
</div>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" rel="stylesheet"/>本文收集自互联网，转载请注明来源。
如有侵权，请联系 [email protected] 删除。
我来说两句