css - Bootstrap 行中的间距和填充/边距

Question

我在理解填充、边距和装订线方面遇到了困难。

任何人都可以帮助我为这个设计找到正确的样式吗？我在列之间和列周围没有任何空间。

我目前的编码是:

<div class = "container">
    <div class = "row">
        <div class = "col-md-12">
            <h3>Heading</h3>
        </div>
        <div class = "col-md-12">
            <div class = "row">
                <div class = "col-md-8" style = "border: solid 1px #003c70;">
                    Some text
                </div>
                <div class = "col-md-4" style = "border: solid 1px #003c70;">
                    Some text
                </div>
            </div>
        </div>
    </div>
</div>

Answer 1

为 border 和 padding 添加额外的 div 样式，如下所示。

<div class = "col-md-8">
    <div class="some-class">
        Some text
    </div>
</div>

检查这个codepen