CSS跨越了一个按钮

Question

我遇到<span>的问题，我希望看起来像“clickfunnels”按钮。

按钮看起来非常好但是当我调整窗口大小（或在移动设备上打开它）时，我调整大小时无法保持该按钮的外观。

这里有按钮：

该网站为http://ivandebenito.com/cads/，因此您可以查看CSS代码。

Answer 1

默认情况下，span元素具有内联显示。 当屏幕尺寸减小时，它会尝试将其保持为内联属性。这就是按钮重叠的原因。如果您想使其与移动设备兼容。在您的css文件的移动设备的媒体查询部分中，将span元素的显示从内联更改为块。如果您不了解媒体查询，可以在谷歌上搜索它。

Answer 2

如果您想避免换行，请将此代码添加到自定义CSS中：

.btn.btn-cta {
   white-space: nowrap;
}

或添加此代码以保持换行符，但更美观：

.btn.btn-cta {
    display: inline-block;
}