jquery - CSS を編集して、列の末尾の余白をなくす

Question

li左にフロートするアイテムを含む、幅が柔軟なディスプレイ コンテナーがあります。li要素がグリッドを形成するようにマージンが設定されています。

質問: グリッドがバック ドロップに対して完全に整列するようliに、右側のラストを設定するにはどうすればよいですか?margin-right:0

私にはJSFiddleがあり、現在のコードは次のとおりです。

CSS :

html, body{margin:0; padding:0; }
.topNav { left:0; right:0; position:absolute; top:0px;
     margin:0 30px 0 30px; text-align:center; height:100px; background-color:grey;
}

.content { margin:130px 30px 0 30px; padding:0; background-color:#999; display:block; float:left; }
.content li{ width:180px; height:280px; background-color:#333; float:left; list-style:none; 
    /* margin:0 0 20px 20px; */
    margin:0 20px 20px 0;
}
.last{clear:both; width:10px; height:10px;  background-color:#999;}

HTML :

<div class="topNav">
</div>

<ul class='content'>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <div class='last'></div>
</ul>

Answer 1

やってみました：

ulSelector > li:last-child{
   margin-right:0;
}