Question

我正在右侧使用简单的css对齐按钮，使用http://www.inboundio.com/services处的向右拉，它适用于第一个块但不适用于第二个块。我不确定出了什么问题，有什么帮助吗？

您可以在上面的网址上看到代码，我也按照SO指南粘贴它

<div class="span12  well">
<ul class="nav nav-list">
<li>
<h3 style="color:#495B67">Heading</h3>
</li>
<li><br>
<p>Sample Text</p><br>
</li>
</ul>
<div class="span8 pull-left">
<strong><b>Your personal consultation will include:</b></strong> 
<p style="font-size: 17.5px">
</p><ol>
<li>How your current marketing strategy compares with your competitors</li>

</ol>
<p></p>
</div>
<div class="span4 pull-right">
<button class="btn btn-warning" type="button"><b>Contact Us</b></button>
</div>

Answer 1

因为第一个块你设置了css值：

.row-fluid [class*="span"]:first-child{margin-left: 0px;}

仅适用于第一个孩子

像.row-fluid .well [class*="span"]{margin-left: 0px;}

一样

Answer 2

存在一些结构问题。

使用以下代码替换HTML部分。

<强>说明：

在上一个框中，您只有两个跨度，但在第二个框中，您有三个跨度而没有换行。所以我添加了一个带有row-fluid类的wrap div。

<div class="span12  well">
   <div class="row-fluid">
      <ul class="nav nav-list">
         <li>
            <h3 style="color:#495B67">Inbound Marketing Consulting and Analysis</h3>
         </li>
         <li>
            <br>
            <p>Request a personalized marketing assessment and receive a 
               one-on-one consultation that will provide you with quick tips and 
               valuable insights that will transform your current marketing strategy.
            </p>
            <br>
         </li>
      </ul>
   </div>
   <div class="row-fluid">
      <div class="span8 pull-left">
         <strong><b>Your personal consultation will include:</b></strong> 
         <p style="font-size: 17.5px">
         </p>
         <ol>
            <li>How your current marketing strategy compares with your competitors</li>
            <li>Full website analysis and opportunities to improve</li>
            <li>SEO tips you can immediately implement into your website</li>
            <li>How to generate more leads via your website</li>
            <li>Blogging, email marketing, and social media strategy</li>
         </ol>
         <p></p>
      </div>
      <div class="span4 pull-right">
         <button class="btn btn-warning" type="button"><b>Contact Us</b></button>
      </div>
   </div>
</div>

CSS引导程序对齐问题 - 向右拉不起作用

2 个答案: