CODEWITHSUNDEEP
htmlcsspagination
NaughtySquid
NaughtySquid

Reputation: 2097

Get pagination to line up with title

On here: https://www.gamingonlinux.com/forum/4 you can see the pagination numbers next to topic titles appear right at the top of the content, is there a way to shift them down so they line up more with the title?

The CSS to control list items:

ul.pagination {
    float: left;
    list-style: none;
    margin: 0;
    padding: 0;
}
ul.pagination_small {
    display: inline-block;
    float: none;
}
ul.pagination li {
    float: left;
    padding: 0;
}
ul.pagination li a.pagination_small {
    padding: 0px 5px;
    margin-right: 2px;
}
ul.pagination li a {
    display: inline-block;
    padding: 0px 9px;
    margin-right: 4px;
    border-radius: 3px;
    border: solid 1px #c0c0c0;
    background: #e9e9e9;
    box-shadow: inset 0px 1px 0px rgba(255,255,255, .8), 0px 1px 3px rgba(0,0,0, .1);
    font-size: .875em;
    font-weight: bold;
    text-decoration: none;
    color: #717171;
    text-shadow: 0px 1px 0px rgba(255,255,255, 1);
}

ul.pagination li:hover a {
    background: #fefefe;
    background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#FEFEFE), to(#f0f0f0));
    background: -moz-linear-gradient(0% 0% 270deg,#FEFEFE, #f0f0f0);
}
ul.pagination li.active a {
    border: none;
    background: #616161;
    box-shadow: inset 0px 0px 8px rgba(0,0,0, .5), 0px 1px 0px rgba(255,255,255, .8);
    color: #f0f0f0;
    text-shadow: 0px 0px 3px rgba(0,0,0, .5);
    pointer-events: none;
}
ul.pagination li.pagination-disabled a {
    pointer-events: none;
    background: #e9e9e9;
}

Upvotes: 0

Views: 57

Answers (1)

Nomistake
Nomistake

Reputation: 863

You can try this:

ul.pagination_small {
    display: inline-block;
    float: none;
    margin-top: 22px;
    position: absolute;
}

Upvotes: 2

Related Questions