JSFiddle - React, Tailwind, and code Playground

by Joao Paulo

HTML

<div class="navigation">
    <div class="pagination">
        <span>Página x de x</span>
        <span class="current">1</span>
        <a href='#' class="inactive">2</a>
        <a href='#' class="inactive">3</a>
        <a href='#' class="inactive">4</a>
        <a href="#">Próxima &rsaquo;</a>
        <a href='#'>Última &raquo;</a>
    </div>
</div>

CSS

.pagination {
    clear:both;
    position:relative;
    font-size:12px;
    text-align:center;
}

.pagination span, .pagination a {
    display:inline-block;
    margin: 2px 2px 2px 0;
    padding:6px 9px 5px 9px;
    text-decoration:none;
    color: #ddd;
    background: #222;
}

.pagination .current{
    padding:6px 9px 5px 9px;
    font-weight: bold;
    background: #0950E8;
}