Editing pagination display

[hueberry]

Hi,

I would like to do some editing to my pagination display but am unable to find a solution to it :-S

When i am viewing products on Page 1, it shows me a bracket to my page 1 (pls refer to attachment "page 1")
But when i go onto Page 2, it shows me a highlighted block (attachment "page 2")

How am I able to edit it so that Page 1 appears with a hightlighted block as well?

Is it under Pagination.tpl? Please help!!

[Radu]

check class .current inside global.css
the problem is because the tag has a higher padding

[hueberry]

Sorry, but what do you mean by class .current? is it under pagination of global.css?

[Radu]

yes it's in global.css

[hueberry]

Could you kindly point out which part i should change please? Thank you =)

#pagination { margin:0 10px; overflow:hidden; }
ul.pagination {
float:left;
height:30px;
line-height:30px;
margin:0;
width:60%;
}
ul.pagination li {
display:inline;
float:left;
margin:0 1px 0 0;
}
ul.pagination li, ul.pagination a, ul.pagination span {
-moz-border-radius:3px;
-webkit-border-radius:3px;
border-radius:3px;
background-color:#ffffff;
}
ul.pagination a, ul.pagination span { padding:1px 3px; }
ul.pagination li.current span {
background:#F6CEE3 none repeat scroll 0 0;
color:#6E6E6E;
}
ul.pagination a { color:#6E6E6E; }
ul.pagination a:hover, #pagination_next a:hover, #pagination_previous a:hover {
background:#ffffff none repeat scroll 0 0;
color:#F781BE;
}
ul.pagination li.truncate { padding:0.3em; background:none; }
li.disabled span { color:#888888; }

[hueberry]

Can anyone help me on this please??

[Radu]

for now change from ul.pagination a:hover, #pagination_next a:hover, #pagination_previous a:hover { background:#ffffff none repeat scroll 0 0;
to
ul.pagination a:hover, #pagination_next a:hover, #pagination_previous a:hover {

do you have a link to your website?