title: row border-top border-bottom hover single line?
body: <p>First, im new so dont give me a hard time ;)</p>
  
  <p>i have a problem with styling my foreach. What I want is that if I hover on the row. It only returns single line bottom and top border. 
  In this case when I hover on the next row the bottom top border from other rows are there creating a 2px border. I tried many things margin-top:-1px etc... some gave me a better result but not the final one.</p>
  
  <p><a href="https://i.stack.imgur.com/d10xb.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/d10xb.png" alt="enter image description here"></a></p>
  
  <p><a href="https://i.stack.imgur.com/TiZmX.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/TiZmX.png" alt="enter image description here"></a></p>
  
  <pre><code>.frameregels{
  border-bottom:1px solid #e1e1e1;
  border-top:1px solid #e1e1e1;       
  }
  .frameregels:nth-child(odd){
  background-color:#FFFFFF;
  }
  .frameregels:nth-child(even){
  background-color:#f9f9f9;       
  }
  .frameregels:hover{
  background-color:#ecf5f9;
  border-color:#66afe9;
  }
  
  &lt;div class="xxlarge-12 xlarge-12 large-12 medium-12 small-12 columns frameregels"&gt;
  &lt;div class="xxlarge-1 xlarge-1 large-2 columns large-down-hidden"&gt;[artikelnr]&lt;/div&gt;
  &lt;div class="xxlarge-11 xlarge-11 large-10 columns large-down-hidden"&gt;[omschrijving]&lt;/div&gt;
  &lt;/div&gt;
  &lt;div class="xxlarge-12 xlarge-12 large-12 medium-12 small-12 columns frameregels"&gt;
  &lt;div class="xxlarge-1 xlarge-1 large-2 columns large-down-hidden"&gt;[artikelnr]&lt;/div&gt;
  &lt;div class="xxlarge-11 xlarge-11 large-10 columns large-down-hidden"&gt;[omschrijving]&lt;/div&gt;
  &lt;/div&gt;
  &lt;div class="xxlarge-12 xlarge-12 large-12 medium-12 small-12 columns frameregels"&gt;
  &lt;div class="xxlarge-1 xlarge-1 large-2 columns large-down-hidden"&gt;[artikelnr]&lt;/div&gt;
  &lt;div class="xxlarge-11 xlarge-11 large-10 columns large-down-hidden"&gt;[omschrijving]&lt;/div&gt;
  &lt;/div&gt;
  </code></pre>