50% floated divs with middle margin

HTML

<div class="clearfix">
    <a class="prev" href="#">Previous</a>
	<a class="next" href="#">Next</a>
</div>

CSS

.clearfix:before, .clearfix:after
{
	content: "";
	display: table;
}

.clearfix:after
{
	clear: both;
}

.clearfix
{
	zoom: 1;
}

.prev {
    background: black;
    color: white;
    font-size: 16px;
    display: block;
    float: left;
    box-sizing: border-box;
    width: 1;
    margin: 0 20%;
}

.next {
    background: black;
    color: white;
    font-size: 16px;
    display: block;
    float: right;
    box-sizing: border-box;
    width: 1;
    margin: 0 20%;
}