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

Question

我正在尝试连接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

提前致谢。

Answer 1

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

您应该将其重置为0：

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