Bootstrap內聯元素

因此，在我的頁面頂部，我有一個標題和一個Facebook徽標。這裏是一個工作示例：fiddle Bootstrap內聯元素

因此，所有內容都位於頁面頂部整齊的一行。但是，我希望徽標和文字Join us on...位於右側，並且標題保持原樣。我已經嘗試將class="pull-right"添加到第二個和第三個<li>元素，like this。但是你可以看到這是如何真正搞砸垂直對齊。除了我想讓它看起來的對齊外。

關於如何修復對齊的任何想法？

來源

2013-04-14 Richard

您可以在li應用右拉式。另外，H4會導致休息，所以你應該把IMG和「加入我們......」放在H4裏面。

試試這個：

<ul class="inline"> 
    <li><h3 class="muted">Heading</h3></li> 
    <li class="pull-right"> 
    <div class="media"> 
     <h4 class="media-heading"> 
     <a href="#"> 
      <img src="http://cache.boston.com/universal/site_graphics/facebook/facebook_logo_36x36.png" style="max-width:100%;" alt="Join us on Facebook" /> 
     </a>  
     Join Us on Facebook 
     </h4> 
    </div> 
    </li> 
</ul>

來源

2013-04-14 21:40:29 ikumen

垂直對齊仍然有點混亂 – Richard

-1

你應該添加另一個元素，並給它「拉右」類。你加入我們的代碼應該在那。

所以你應該有這樣的;

<ul> 
    logo 
</ul> 
<ul class="pull-right"> 
    join us 
</ul>

來源

2013-04-14 17:52:43 tcgumus

這絕對沒有工作，它把一切都在一個新行。我需要全部三項（標題，標識，文本）全部排成一行 – Richard

Bootstrap內聯元素

回答

相關問題