pagination with css
Posted
by bsandrabr
on Stack Overflow
See other posts from Stack Overflow
or by bsandrabr
Published on 2010-04-11T19:07:46Z
Indexed on
2010/04/11
19:13 UTC
Read the original article
Hit count: 419
Hi I've tried every combination I can think of but I can't get this to work. Can you help? I'm trying to put some css onto my pagination and have read all the examples but they all contain so many backslashes and concatenation that I just dont know how to apply it Here is my pagination code (which works fine) along with my feeble attempt at styling it
if ($st > 0)
{ $st3=$st; print "< Previous Page "; }
$f=$st+3; for($i2=$st+1;$i2<=$f;$i2++) { $i3=$i2-3; if ($i3 > 0) { print "$i3 "; if($i2 % 3 == 0) { print ""; } } }
$g=$st+3; for($i=$st+1;$i<=$g;$i++) {
print "$i "; if($i % 3 == 0) { print ""; } }
$st2=$st+2; print " Next Page >";
Here is the css that I took from the website
/* CSS Document */
body { background: #2D2D2D; font-family:Verdana, fantasy; font-size:13px; color: white; scrollbar-base-color: black; scrollbar-arrow-color: red; scrollbar-DarkShadow-Color: black; } a:visited,a:active,a:link { color: white;text-decoration: none; } a:hover { color: red;text-decoration: overline underline;background: none; } table,tr,td { font-family:Palatino Linotype; color: #FFFFFF;font-size: 12px; } .button { font-family:Verdana, fantasy; font-size:13; color:#FFFFFF; background-color: red; } input,textarea,dropdown{ font-family:Verdana, fantasy; font-size:13; color: #FFFFFF; background-color: #000000; border: 1px solid; } textarea,.submit input{ font-family:Verdana, fantasy; font-size:13; color:#ffffff; background-color: black; } .table { background-color:#000000; } .table3 { background-color:#000000; } .table td { color: #000000; background-color:#DEDEDE; height:22px; } .table3 td { background-color:#CCCCCC; } td .alt { background-color:#EEEEEE; height:22px; } td .h { background-image:url(tablehgrad.png); background-repeat:repeat-x; font-weight: bold; background-color: #D6D6D6; } .table th { background-image:url(tablehgrad.png); background-repeat:repeat-x; color: #000000; font-weight: bold; background-color: #D6D6D6; } .menu th { font-font-size: 12px; color: silver; background-image:url(th.png); background-repeat:repeat-x; font-weight: bold; background-color: #4B4B4B; } .stats td { font-font-size: 12px; color: white; font-weight: bold; } .menu td { font-size: 12px; text-align: center; color: white; background-image:url(tdover.png); background-repeat:repeat-x; font-weight: bold; background-color: #4B4B4B; } .menu td:hover{ color: white; background-image:url(td.png); div.pagination { padding: 3px; margin: 3px; }
div.pagination a { padding: 2px 5px 2px 5px; margin: 2px; border: 1px solid #AAAADD;
text-decoration: none; /* no underline */
color: #000099;
} div.pagination a:hover, div.pagination a:active { border: 1px solid #000099;
color: #000;
} div.pagination span.current { padding: 2px 5px 2px 5px; margin: 2px; border: 1px solid #000099;
font-weight: bold;
background-color: #000099;
color: #FFF;
}
div.pagination span.disabled {
padding: 2px 5px 2px 5px;
margin: 2px;
border: 1px solid #EEE;
color: #DDD;
}
thanks
© Stack Overflow or respective owner