Bootstrap中行元素的不均匀填充

Question

我在Twitter Bootstrap中有一个由4 rows组成的网格布局。

我希望每一行的高度均匀，每行内容之间填充相等。

但是，行上的填充现在不相等。

例如，“技术”和hr行中li项目的底部空间比“教育”脚下的空间窄得多。

我不能在我的CSS中看到我出错的地方，但是我怎样才能在整个地方应用相等的填充？在此先感谢

Here is the link to my website where the issue is.

<div class="container"> 

    <div id="greeting"> 
      <p> 
       My interest in coding primarily stemmed from my day job which exposed me to the basics of HTML. I've still got a long way to go but it's my ambition to forge a long-term career as a developer, and I'm very determined to reach my goal. 
      </p> 
    </div> 
    <div class="hr"><hr></div> 
    <div class="row"> 
     <div class="col-md-4"> 
      <h2 class="sideheader">Technologies</h2> 
     </div> 
     <div class="col-md-4"> 
      <h2 class="tech-header">Comfortable</h2> 
      <ul> 
       <li> HTML5</li> 
       <li> CSS3</li> 
       <li> Bootstrap</li> 
       <li> Adobe PhotoShop</li> 
      </ul> 
     </div> 
     <div class="col-md-4"> 
      <h2 class="tech-header">Finding my feet</h2> 
      <ul> 
       <li> JavaScript</li> 
       <li> JQuery</li> 
       <li> PHP</li> 
       <li> SQL</li> 
      </ul> 
     </div> 

    </div> 
    <div class="hr"><hr></div> 
    <div class="row"> 
     <div class="col-md-4"> 
      <h2 class="sideheader">Experience</h2> 
     </div> 

     <div class="col-md-8"> 
      <h2>Reader Offer Administrator/Account Manager</h2><br><h3>Thompson &amp; Morgan - March 2007 to August 2015</h3> 
      <p>A highly varied role acting as support to a successful and fast-moving sales team as well as contact to our client base. My primary duties were to maintain the smooth running of our order processing system, as well as oversee a range of product content across several CMSs. It was this latter part of my job which has spurred me to establish a career in web development.</p> 
     </div> 
    </div> 
      <div class="hr"><hr></div> 
    <div class="row"> 
     <div class="col-md-4"> 
      <h2 class="sideheader">Education</h2> 
     </div> 

     <div class="col-md-8"> 
     <h2>University of Brighton</h2><br><h3>October 2003 to July 2006</h3> 
      <ul> 
       <li> BA(Hons) Social Science (2:1)</li> 
      </ul> 
     </div> 
    </div> 

    <div class="hr"><hr></div> 
    <div class="row"> 
     <div class="col-md-12" id="button"> 
     <a href="Jon Howlett.pdf" class="btn btn-primary btn-lg">View my full CV</a> 
     </div> 
    </div> 

Answer 1

这是您的特定代码：

HTML：

<div class="col-md-8"> 
     <h2>Reader Offer Administrator/Account Manager</h2> 
     <br> <----- REMOVE THIS 
     <h3>Thompson &amp; Morgan - March 2007 to August 2015</h3> 
     <p>A highly varied role acting as support to a successful and fast-moving sales team as well as contact to our client base. My primary duties were to maintain the smooth running of our order processing system, as well as oversee a range of product content across several CMSs. It was this latter part of my job which has spurred me to establish a career in web development.</p> 
    </div> 

的CSS：

#resume h3, #resume .col-md-8 li, #resume .col-md-8 p { 
    top: -60px;  <----- REMOVE THIS 
    position: relative; 
} 

如果删除<br/>和top:60px;每一件事情恢复到正常。