Hi

I noticed that in Opera/Safari and Chrome the image arrow overlaps with the "back" text. It works fine on Firefox and IE.
Any suggestion?

Here is the code for CSS below

/* Bottom Pagiante part */

.paginate-c {
      background-color:#fff; 
}
.paginate {
   border:0px solid red; 
  padding:10px 0 25px 25px; ;
   margin:0;    
}
 .paginate ul {
    list-style-type: none;
}
.paginate li {
    float: left;
    display: inline;
    margin: 0 5px 0 0;
    display: block;
    font-weight:900;
border-left:1px solid #000;
padding-left:5px;
}
.paginate li.firstitem {
border:none;
}

.paginate li.next {
    border: none;
}
.paginate li.next a{

    background-image: url(../images/global/red_forward.jpg);
    background-repeat: no-repeat;
    background-position: left center;
        padding: 0px 20px;
        border:0px solid red;
        

}
.paginate li.back {
    border: none;
}
.paginate li.back a{
    background-image: url(../images/global/red_back.jpg);
    background-repeat: no-repeat;
    background-position: right center;
     border:0px solid red;
    padding-right:  20px;
        
}

.paginate li.paginate-current {
font-weight:normal;
}
.paginate li.totpage {
border:0px solid red;
padding:0;
}

HTML BIT :

 <!--Start paginate bit-->
           <div class="paginate-b">
                 <div class="paginate-c">
                       <ul class="paginate">                                
                            <li class="back"><a href="#">back </a></li>
                            <li class="firstitem"><a href="#">1</a></li>
                            <li><a href="#">2</a></li>
                            <li class="paginate-current">3</li>
                            <li><a href="#">4</a></li>
                            <li><a href="#">5</a></li>
                             <li><a href="#">6</a></li>
                              <li><a href="#">7</a></li>
                               <li><a href="#">8</a></li>
                                <li><a href="#">9</a></li>
                             
                             <li class="totpage">..... <a href="#">18</a></li>
                            <li class="next"><a href="#"> next </a></li>
                       </ul>
                   </div>
                 </div> 
                   <!--End paginate bit-->

Hmm. If you gave me the arrows i'd check it.

But basically Safari and Chrome both run on WebKit and Opera runs on something else so it has to be a problem with the frameworks. I can't really tell you why though.