ウェル内の要素を揃える方法は？

Question

私は、井戸内のテキストでボタンを整列しようとしています。

これは私が得ることができるベストです：私はH4とBTNとの間のスペースを取得するように見えることができない以上により

btn { 
background-color: #FFF; 
outline-color: #000; 
} 

：ボタン上の

<div class="container"> 
    <div class="row"> 
     <div class="col-lg-12"> 
      <div class="well"><h4>Download our 2016 Registration form today!<button type="btn" class="btn btn-default centered">Download Now!</button></h4> 
      </div> 
     </div> 
    </div> 
</div> 

はCSS。 ..彼らは一緒にタイトなので、詰め物は&余裕がないようです。

以前は、h4とbtnをそれぞれcol-md-8とcol-md-6に挿入して、独自のスペースを確保しようとしましたが、水平に並べることができませんでした。

次に、github https://github.com/twbs/bootstrap/issues/16933でこれらの記事を読んで.... https://github.com/twbs/bootstrap/issues/1446 ...この問題のような音はしばらくありましたか？

私は、h4とbtnを近づけて、注意を引くために赤のフィールドに保持したいと思っています。

助けが必要ですか？

Answer 1

織り：http://kodeweave.sourceforge.net/editor/#6e1a68050ce5981e47e0512857f2dd73

あなたはこのためmedia queriesを使用することができます。

CSS：

.btn { 
    background-color: #FFF; 
    outline-color: #000; 
    display: inline-block; 
    float: right; 
    margin: -9px 0; 
} 
.well { 
    text-align: left; 
} 

@media all and (max-width: 575px) { 
    .well { 
    text-align: center; 
    } 
    .btn { 
    display: block; 
    clear: both; 
    float: none; 
    text-align: center; 
    margin: 20.92px auto; 
    } 
} 

Answer 2

あなたのテキストを整列させるために<table><table/>を使用するのが一般的です。 1行目と2 columesでテーブルにボタンやテキストを配置

<table> 
    <tr> 
     <td> 
      TEXT 
     <td/> 
     <td> 
      BUTTON 
     <td/> 
    </tr> 
<table/> 

あなたはページがボタン、テキストボックス、IMGSのある一つの大きなテーブルであることがわかります（でも、この1）のウェブサイトで見て回る場合タイル