我正在使用bootstrap v4,当我在额外的div中包装列时,布局会被破坏.这是为什么？链接到codepen
http://codepen.io/mariuszdaniel/pen/aJJjzJ
作品
<div class="container">
<div class="row">
<div class="col-4"></div>
<div class="col-8"></div>
</div>
</div>
不工作
<div class="container">
<div class="row">
<div class="myclass">
<div class="col-4"></div>
<div class="col-8"></div>
</div>
</div>
</div>
解决方法
这是因为col- *必须直接放在行内.
阅读Bootstrap docs ..
“Content should be placed within columns,and only columns may be
immediate children of rows.”
这在Bootstrap 4中尤为重要,因为如果不直接放在.row中,列将只是垂直堆叠/包裹.
另请阅读：
How the Bootstrap Grid Works
Bootstrap Rows and Columns – Do I need to use row?
Bootstrap 4.0 Grid System Layout not working