带有glyphicon按钮的按钮

nub*_*nub 2 css twitter-bootstrap-3

我有一个简单的按钮,我试图添加一个glyphicon以获得时尚.

 <div class="row">
  <div class="col-md-4 col-sm-6 col-xs-8">
    <div class="container-fluid">
      <div class="form-group">            
        <button class="btn btn-primary form-control">
          Test
          <span class="pull-right">
            <span class="glyphicon glyphicon-edit">
            </span>
          </span>
        </button>            
      </div>
    </div>
  </div>
</div>
Run Code Online (Sandbox Code Playgroud)

虽然它在chrome和safari上完美运行,但是glyphicon在mozilla上的位置很差.是否有一个众所周知的问题,或者我是否在使用bootstrap css做错了什么?

如果你想要确切地看到我想要获得的东西(在chrome上),以及什么是错误的(在mozilla上),这就是plunker.

cod*_*eee 14

请尝试以下代码,你必须添加一个内联属性white-space:inherit!重要; 按钮

 <div class="row">
 <div class="col-md-4 col-sm-6 col-xs-8">
 <div class="container-fluid">
  <div class="form-group">            
    <button class="btn btn-primary form-control" style="white-space: inherit ! important;">
      Test
      <span class="pull-right">
        <span class="glyphicon glyphicon-edit">
        </span>
      </span>
    </button>            
  </div>
 </div>
 </div>
 </div>
Run Code Online (Sandbox Code Playgroud)

  • 请不要编辑Bootstrap css创建自己的类名作为btn-right-icon add .btn-right-icon {white-space:inherit!重要; 并应用于该按钮,所以不要担心在bootstrap中破坏某些东西 (3认同)