twitterのブートストラップでサイズとセンターのアラートボックスを設定する

Question

私はセンターを開けようとしていて、サイズを80%に設定しようとしていますが、クラスtext-centerでは機能しません。

<div class="text-center"> 

    <div class="alert alert-info" style="width: 80%;" role="alert"> <i class="fa fa-exclamation-triangle" aria-hidden="true"></i> <strong>Hey!</strong> It's just an alert... </div> 

</div> 

Answer 1

<div class="container-fluid"> 
    <div class="row"> 

     <div class="col-md-10 col-md-offset-1"> 
      <div class="alert alert-warning alert-dismissible fade in text-center" role="alert"> 
       <strong>Holy guacamole!</strong> Best check yo self, you're not looking too good. 
      </div> 
     </div> 

    </div> 
</div> 

クラスtext-center機能を。ブートストラップグリッド内に.alertをラップすると、通知の合計幅を制限することもできます。

コードをオーバーライドしている可能性のある追加のCSSがないことを再度確認します。これはBootplyでテストされました：http://www.bootply.com/MFv1HMC0G7

Answer 2

alertで使用center-block代わりのtext-centerあなたが全体のアラートを中央揃えにしたい場合。

<div class="alert alert-info center-block" style="width: 80%;" role="alert"> <i class="fa fa-exclamation-triangle" aria-hidden="true"></i> <strong>Hey!</strong> It's just an alert... </div> 

あなたのように、アラートの使用の内のテキストを中央揃えにしたい場合：予想通り

<div class="alert alert-info" style="width: 80%;" role="alert"> 
    <p class="text-center"> 
    <i class="fa fa-exclamation-triangle" aria-hidden="true"></i>  <strong>Hey!</strong> It's just an alert... 
    </p> 
</div>