Question

因此，在我的页面顶部，我有一个标题和一个facebook徽标。这是一个有效的例子：fiddle

所以一切都在页面顶部整齐排列。但是，我希望徽标和文本Join us on...位于右侧，标题保持原样。我已尝试将class="pull-right"添加到第2个和第3个<li>元素like this。但你可以看到这是如何真正搞砸了垂直对齐。除了对齐之外，我希望它看起来如何。

有关如何修复路线的任何想法？

Answer 1

您可以在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>

Answer 2

你应该添加另一个元素并给它“拉右”类。您加入我们的代码应该在那里。

所以你应该喜欢这个;

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

Bootstrap内联元素

2 个答案: