¿Cómo centro elementos flotantes?

Estoy implementando la paginación, y necesita estar centrada. El problema es que los enlaces deben mostrarse como bloques, por lo que deben flotar. Pero entonces, text-align: center; no funciona en ellos. Podría lograrlo dando el relleno div wrapper de la izquierda, pero cada página tendrá un número diferente de páginas, por lo que no funcionaría. Aquí está mi código:

.pagination {
  text-align: center;
}
.pagination a {
  display: block;
  width: 30px;
  height: 30px;
  float: left;
  margin-left: 3px;
  background: url(/images/structure/pagination-button.png);
}
.pagination a.last {
  width: 90px;
  background: url(/images/structure/pagination-button-last.png);
}
.pagination a.first {
  width: 60px;
  background: url(/images/structure/pagination-button-first.png);
}

<div class='pagination'>
  <a class='first' href='#'>First</a>
  <a href='#'>1</a>
  <a href='#'>2</a>
  <a href='#'>3</a>
  <a class='last' href='#'>Last</a>
</div>
<!-- end: .pagination -->

Para tener la idea, lo que quiero: