Lista com bordas sobrepostas

HTML

<ul>
    <li>
        <a href="#" title="">1</a>
    </li>
    <li>
        <a href="#" title="">2</a>
    </li>
    <li>
        <a href="#" title="">3</a>
    </li>
    <li>
        <a href="#" title="">4</a>
    </li>
    <li>
        <a href="#" title="">5</a>
    </li>
    <li>
        <a href="#" title="">6</a>
    </li>
    <li>
        <a href="#" title="">7</a>
    </li>
    <li>
        <a href="#" title="">8</a>
    </li>
</ul>

CSS

ul, li, a{
    display:block;
    margin:0;
    padding:0;
}
ul{
    width:100%;
}
li{
    float:left;
    width:25%;
}
a{
    border:1px solid #c9c7c7;
    text-align:center;
    height:200px;
}

li a { 
    border-right-color: transparent; 
    border-bottom-color: transparent;
}
li:nth-child(4n) a { border-right-color: #c9c7c7; }
li:nth-last-child(-n+4) a { border-bottom-color: #c9c7c7; }