Html 如何确保填充也影响所有行，而不仅仅是第一行？

因此，我通过引导对一段文本应用了一些填充。但是，当该行通过
转到下一行时，该行的填充将不再适用

该问题的具体代码如下：

            <div class="col-sm-12 d-sm-flex d-md-inline align-items-sm-center justify-content-sm-center ">
                    <div class="py-md-20 mx-md-10">
                            <span class="py-sm-40 px-sm-20 px-md-70">
                                Before any Service or Repair we will carry out a full check of the bike to ensure the bike is safe and you <br> are getting the service that best suits you and your bike. 
                            </span>

                            <span>
                                <button class="b-button__outline text-bg-info"> Book Assessment </button>
                            </span>

                    </div>
                        </div>

在进行任何保养或维修之前，我们将对自行车进行全面检查，以确保自行车安全，并且
您将得到最适合您和您的自行车的服务。
图书评估

请注意，需要外部样式表才能准确地看到发生了什么。因此，应该可以帮助您更详细地了解问题

文字“正在获得最适合您和您的自行车的服务。”似乎没有任何填充物

我的目标是让它看起来像这样：

我做错了什么？

试试看

span {
  display: block;
}

或

---

寻求代码帮助的问题必须包含在问题中重现问题所需的最短代码，最好是在堆栈片段中。虽然您提供了一个链接，但如果该链接无效，您的问题对其他将来遇到相同问题的用户将毫无价值。请参阅。投票也结束了，因为我通过制作一个代码片段来帮助您的工作已经完成，而没有提供另一种方法来发布重现问题所需的最少代码。如果我们不能重现你的问题，我们就帮不了你。看来我试图编辑这篇文章，是为了跟你一样，遵循保利的建议。很抱歉

span {
  display: inline-block;
}