2017-03-13 32 views
0

我在下面有以下代码,但我遇到了间距问题。我正在使用bootstrap。我怎么能拥有标题和价值,例如“伦纳德月亮”。一直只有20 px的距离?显示多列文本期间引导程序空间问题

如何缩小间距? 高级顾问伦纳德Moonsoooon

这里是我下面的代码和小提琴 FIDDLE

<div id="clientData"> 
       <div class="row"> 
        <div class="col-md-2 col-sm-2 col-xs-6 col-md-2OW"> 
        <div class="name"><strong>Senior Advisor </strong></div> 
        <!--<div class="account"><strong> Prod </strong></div> 
        <!-- <div class="approved"><strong> Prod </strong></div> 
        <div class="activity"><strong> Last Activity </strong></div> 
        <div class="activity"rong> Risk Category</strong></div> --> 
        </div> 
        <div class="col-md-2 col-sm-2 col-xs-6"> 
        <div class="name">Leonard Moonsoooon</div> 
        <!--<div class="account">0789</div> 
        <!--<div class="approved">12/5/2015</div> 
        <div class="activity">4/1/2016</div> 
        <div class="riskcategory"> 
         <div style="background:Yellow; padding:2px;height:18px; width:50px;"></div> 
        </div>---> 
        </div> 
        <div class="clearfix visible-xs-block"></div> 
        <div class="col-md-2 col-sm-3 col-xs-6 col-md-2OW12 thirdrdcolTitle"> 
        <div class="brokerage"><strong> Company </strong></div> 
        <!--<div class="approved"><strong> Max Approved Loan Amt </strong></div> 
        <div class="balance"><strong> Loan Balance </strong></div> 
        <div class="credit"><strong> Available Credit </strong></div> 
        <div class="aging"><strong> Days in this Category </strong></div> --> 
        </div> 
        <div class="col-md-2 col-sm-2 col-xs-6"> 
        <div class="pledged "> YUMark</div> 
        <!--<div class="approved "> $2,050,877.82</div> 
        <div class="balance "> $1,849,000.00</div> 
        <div class="credit "> $201,877.82</div> 
        <div class="aging "> 3</div>--> 
        </div> 
        <div class="clearfix visible-xs-block"></div> 
        <div class="col-md-1 col-sm-1 col-xs-6">     
         <div class="account"><strong> Production </strong></div> 

        </div> 
        <div class="col-md-2 col-sm-2 col-xs-6"> 
         <div class="pledged "> 2351</div> 

        </div> 
       </div> 
      </div> 

回答

0

你有一些非常时髦的HTML对那里发生的。但是,最简单的方法是将两个值放在一列div中,而不是两列。

.name strong{margin: 0 20px 0 0;}
<div class="col-md-4 col-sm-4 col-xs-12 col-md-2OW"> 
 
    <div class="name"><strong>Senior Advisor</strong> Leonard Moonsoooon</div> 
 
</div>

https://jsfiddle.net/pwku8qam/