html - 左边是文字，右边是图标 - Bootstrap

Question

如何使用 Bootstrap 将图标放置在最右侧并使文本保持在左侧。

这是我到目前为止的努力:https://www.bootply.com/5E2CGFEWdx

<link href="https://stackpath.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" />

<div class="container">
  <div class="row">
    <button class="btn btn-lg btn-success col-xs-12"> Call Us <span class="glyphicon glyphicon-earphone push-right"></span></button>
  </div>
</div>

Answer 1

您可以使用 float: right 使您的图片靠右，并设置 text-align: left 这样文本将从左端开始。

Example here

align-left {
  text-align: left;
}

.push-right {
  float: right;
}

<link href="https://stackpath.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" />

<div class="container">
  <div class="row">
    <button class="btn btn-lg btn-success col-xs-12 align-left"> Call Us <span class="glyphicon glyphicon-earphone push-right"></span></button>
  </div>
</div>