Problem with last-child

0

I have a problem with this: I have a "parent" div and inside this div I have 6 li and within the div "father" has the "box_padrao" div and this " box_padrao "displays 3 by lines ai has a margin-right of 5px and to take and margin the last li use the last-child, only that the problem comes there, it only removes the margin from" box_padrao 6 ", and I need it take out "box_padrao 3" too, how would I do this magic? Thank you very much for your attention.

<style type="text/css">
  .pai{
    width: 408px;
  }
  .pai ul li .box_padrao{
    float: left;
    margin: 0 5px 0 0;
    width: 132px;
    height: 150px;
    background: #ccc;
  }
  .pai ul li:last-child .box_padrao{
    margin: 0;
  }
</style>
<div class="pai">
    <ul>
      <li><div class="box_padrao">1</div></li>
      <li><div class="box_padrao">2</div></li>
      <li><div class="box_padrao">3</div></li>
      <li><div class="box_padrao">4</div></li>
      <li><div class="box_padrao">5</div></li>
      <li><div class="box_padrao">6</div></li>
    </ul>
</div>
    
asked by anonymous 02.10.2017 / 19:18

1 answer

1

The name of the spell is: nth-child

.pai ul li:nth-child(3n) .box_padrao{
  [...]
}

Every 3% with% will apply this property. which in the case, in 3 and 6

    
02.10.2017 / 19:32