【问题标题】:Getting rid of Twitter Bootstrap span margin摆脱 Twitter Bootstrap 跨度边距
【发布时间】:2013-07-24 22:35:03
【问题描述】:

我正在使用引导程序并试图让两个跨度并排出现,同时还删除跨度之间的白边距。
如果我做代码,每个跨度之间都有一个白边

我的代码是:

<li class="span4" >
    <div class="thumbnail">
         <img src="img/placeholder-360x200.jpg" alt="product name">
             <div class="container row-fluid">  
                  <b>
                     <span class="span6 nospace" id="one"> <font size ="5px"><i>PHP 100,000</i></span>

                     <span class="span6 nospace pull-right" id="two" >50% Off </span>
                               </font>
                </b>

              </div>
           <div class="caption">

                <p>
                  Few attractive words about your product.Few attractive words about your product.
                </p>

              </div>

                  <div class="widget-footer">
                <p>
                  <a href="#" class="btn btn-primary">Buy now</a>&nbsp;
                  <a href="product.html" class="btn">Read more</a>
                </p>
                  </div>  

            </div>
          </li>

虽然我尝试在 CSS 上添加它:

.nospace{

左边距:0; }

这是我的代码给我的:

这是我想要做的:

【问题讨论】:

    标签: css twitter-bootstrap margin


    【解决方案1】:

    您应该在row-fluid 类中使用span 类来消除边距

    【讨论】:

    • 你的意思是这样的吗:
    • 最佳实践是容器-> 行流体-> 跨度
    • 我的速度有点慢,我刚开始接触前端编码。和
    • 没关系,我有 7 年的前端编码经验,我仍然认为我是自学者
    • 我刚开始接触前端编码。而我认为你我要做的是这样的事情?
    【解决方案2】:

    试试这个

    .span6.nospace{
    margin-left:0;
    }
    

    =============================================

    或习惯这样,但这是卧床练习

    .nospace{margin-left:0 !important;} //  
    

    【讨论】:

    • 你正在使用这种方式
      PHP 100,000
      50% 折扣
    【解决方案3】:

    在你的编码中` 100,000 菲律宾比索

            <span class="span6 nospace pull-right" id="two" >50% Off </span>`
    

    移除 pull-right 请避免在 twitter bootstrap 中使用 pull-right 或 pull-left。

    【讨论】:

    • 谢谢,我已经删除了 pull-right 类,但它只影响了 'PHP 100,000' 文本。
    • 给个链接,jsfiddle不能用
    • 尝试将 margin-left:0 赋予 id #two 并尝试使用 class 而不是 nospace