左，右對齊在引導密鑰對值

可以說我有以下幾點：左，右對齊在引導密鑰對值

 <div class="card"> 
      <ul class="list-group list-group-flush "> 
       <li class="list-group-item" style="border: none;"> 
        <strong>Something</strong> : 12333434 
       </li> 
       <li class="list-group-item" style="border: none"> 
        <strong>Something else</strong>: 2837487248723847283 
       </li> 
       <li class="list-group-item" style="border: none"> 
        <strong>Some other stuff</strong>: 123442342423423 
       </li> 
      </ul> 
     </div>

上面看起來像下面的瀏覽器：

但最好我希望它看起來像下面一樣（忽略字體變化，我只關心對齊）：

含義左側對齊右側，右側文本對齊左側。如何在bootstrap中實現這一點？

來源

2017-04-24 MHOOS

使用inline-block這可以實現。默認strong是inline。

strong{ 
    display:inline-block; 
    width:200px; 
    text-align:right; 
}

這裏是小提琴link

來源

2017-04-24 21:07:05

這不是我想要的。我想要所有那些東西排列在右邊，就像第二張圖片一樣。你發給我的東西看起來不像。 – MHOOS

沒問題。我編輯了答案。 –

這裏是固定根據引導你可以試試下面的代碼。

<div class="card text-center"> 
      <ul class="list-group list-group-flush "> 
       <li class="list-group-item" style="border: none;"> 
        <strong>Something</strong> : 12333434 
       </li> 
       <li class="list-group-item" style="border: none"> 
        <strong>Something else</strong>: 2837487248723847283 
       </li> 
       <li class="list-group-item" style="border: none"> 
        <strong>Some other stuff</strong>: 123442342423423 
       </li> 
      </ul> 
     </div>

Here is your fiddle link

乾杯！

來源

2017-04-25 03:34:12

左，右對齊在引導密鑰對值

回答

相關問題