在引导程序上的按钮内对齐两个元素时出现问题

Question

我正在尝试使用Bootstrap 4将两个文本水平粘贴在按钮内。 总是将“链接”一词推到下一行，我希望它在“复制”旁边。

我尝试过使用Float，但是它会将“链接”推到了右边。

<div className="col-3 w3-button w3-tiny">
  <button
    onClick={() => {
      this.copyReferralLink();
    }}
    className="btn btn-block btn-primary"
  >
    {this.props.t("Copy")}
    <span className="d-none d-sm-block btn-primary float-right">
      {this.props.t("link")}
    </span>
  </button>
</div>

这是我到目前为止所拥有的，我们将为您提供任何帮助！

Answer 1

您将使用d-sm-inine-block而不是d-sm-block类。

另外，您可能希望将this.props.t("Copy")包裹到自己的span中。