从2 <div>标记之间删除空格

时间:2018-04-04 15:19:59

标签: html css twitter-bootstrap

我正在尝试连接div标签(标题和内容),但我们无法删除它们之间的空白区域。

我已经浏览了一下,尝试将边距和字体大小设置为0,这没有任何帮助,并且内联块有效,但是,之后所有的文本对齐都搞砸了。

<!-- Pricing Boxes -->
<div id="home-pricing">
    <div class="container">
        <div class="row">
            <div class="pricing-title">
                <h1>Select Your Membership Options</h1>
                <p>Each tier of membership offers a varied amount of features</p>
                <div class="divider"></div>
                <!-- Signup Boxes -->
                <div class="col-md-4 col-sm-4 col-xs-12">
                    <div class="pricing-box">
                        <div class="pricing-box-title">
                            <h1>Free Trial</h1>
                            <p>30 Days Free Trial</p>
                        </div>
                        <div class="pricing-box-details">
                            <li><i class="fas fa-check"></i> Access to hundreds of courses</li>
                            <li><i class="fas fa-times"></i> Unlimited Email Support</li>
                            <li><i class="fas fa-times"></i> Offline Course Availability</li>
                            <li><i class="fas fa-times"></i> 2 Hour Priority Support</li>
                            <button>SELECT</button>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

Bootply链接: https://www.bootply.com/eMYEP1J9E1

提前致谢。

1 个答案:

答案 0 :(得分:4)

空格由<p>底部边距引起:

enter image description here

您应该将其重置为0:

.pricing-box-title p {
  margin-bottom: 0;
}