twitter-bootstrap - 在 Bootstrap 中填充

Question

我使用 Bootstrap :

<div id="main" class="container" role="main">
<div class="row">
    <div class="span6">
        <h2>Welcome</h2>
        <p>Hello and welcome to my website.</p>
    </div>
    <div class="span6">
        Image Here (TODO)
    </div>
</div>  

Main 也有灰色背景。页面背景为白色。我遇到的问题是文本正好在灰色背景的边缘。我想要一些填充，但是当我添加它时，图像跨度会转到下一行。

有什么想法我哪里出错了吗？

Answer 1

我没有使用过 Bootstrap，但我在 Zurb Foundation 工作过。我曾经在上面添加这样的空间。

<div id="main" class="container" role="main">
    <div class="row">

        <div class="span5 offset1">
            <h2>Welcome</h2>
            <p>Hello and welcome to my website.</p>
        </div>
        <div class="span6">
            Image Here (TODO)
        </div>
    </div>

访问此链接: http://getbootstrap.com/2.3.2/scaffolding.html并阅读部分:偏移列。

我想我知道你做错了什么。如果您将填充应用到 span6像这样:

<div class="span6" style="padding-left:5px;">
    <h2>Welcome</h2>
    <p>Hello and welcome to my website.</p>
</div>

这是错误的。您需要做的是向里面的元素添加填充:

<div class="span6">
    <h2 style="padding-left:5px;">Welcome</h2>
    <p  style="padding-left:5px;">Hello and welcome to my website.</p>
</div>