我在下面附上一個指向我的父元素的鏈接，它基本上是一個<div >：-
下面我附上了從父元素流出的子元素的影像：-
我如何開始檢查此問題以找出子元素流出父元素的原因。我試圖確保留在父元素內。
uj5u.com熱心網友回復：
基本上。它流出，因為桌子不適合里面col-md-8。
它有太多的列。
為了避免溢位，您可以添加：overflow-auto以col-md-8使其水平滾動。
沒有的例子 overflow-auto
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css">
<div class="container">
<div class="row">
<div class="col-md-4">
some content
</div>
<div class="col-md-8" style="background-color: blue">
<table>
<tbody>
<tr>
<td>column 1</td>
<td>column 2</td>
<td>column 3</td>
<td>column 4</td>
<td>column 5</td>
<td>column 6</td>
<td>column 7</td>
<td>column 8</td>
<td>column 9</td>
<td>column 10</td>
<td>column 11</td>
<td>column 12</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>示例與 overflow-auto
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css">
<div class="container">
<div class="row">
<div class="col-md-4">
some content
</div>
<div class="col-md-8 overflow-auto" style="background-color: blue">
<table>
<tbody>
<tr>
<td>column 1</td>
<td>column 2</td>
<td>column 3</td>
<td>column 4</td>
<td>column 5</td>
<td>column 6</td>
<td>column 7</td>
<td>column 8</td>
<td>column 9</td>
<td>column 10</td>
<td>column 11</td>
<td>column 12</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>轉載請註明出處，本文鏈接：https://www.uj5u.com/shujuku/320847.html
標籤：html css 推特引导 twitter-bootstrap-3 网格
上一篇：基于道具的元素的條件渲染順序？