Add css style to pagination [Archive]

ofi

12-25-2008, 12:24 AM

hi
how can i do this, add digg css style to pagination

here is the css digg style, demo http://www.mis-algoritmos.com/2007/03/16/some-styles-for-your-pagination/

/*CSS Digg style pagination*/
div.pagination {
padding: 3px;
margin: 3px;
text-align:center;
}

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.digg 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;
}

i have working pagination code, and at botton is this code

<table>
<tr>
<td><?=($cPage > 1 ? '<a href="?sida=1"><<</a>' : '<<')?></td>
<td><?=($cPage > 1 ? '<a href="?sida='.($cPage-1).'"><</a>' : '<')?></td>
<td>Síða <?=$cPage;?> af <?=$cPages;?></td>
<td><?=($cPage != $cPages ? '<a href="?sida='.($cPage+1).'">></a>' : '>')?></td>
<td><?=($cPage != $cPages ? '<a href="?sida='.$cPages.'">>></a>' : '>>')?></td>
</tr>
</table>

how can add this style in ?

bluewalrus

12-25-2008, 02:53 AM

Ummm... you have the css working but just not here or you dont have css working at all if the latter then try...

<div class="pagination">
<table>
<tr>
<td><?=($cPage > 1 ? '<a href="?sida=1"><<</a>' : '<<')?></td>
<td><?=($cPage > 1 ? '<a href="?sida='.($cPage-1).'"><</a>' : '<')?></td>
<td>Síða <?=$cPage;?> af <?=$cPages;?></td>
<td><?=($cPage != $cPages ? '<a href="?sida='.($cPage+1).'">></a>' : '>')?></td>
<td><?=($cPage != $cPages ? '<a href="?sida='.$cPages.'">>></a>' : '>>')?></td>
</tr>
</table>
</div>

If that doesn't work try posting all of your code

Disa

12-25-2008, 10:27 AM

This dont seems to be working, here is full code of the page.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;
charset=ISO-8859-1" />

<title></title>
<style type="text/css">
/*CSS Digg style pagination*/
div.pagination {
padding: 3px;
margin: 3px;
text-align:center;
}

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.digg 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;
}
</style>
</head>

<body>

<h3></h3>

<?php
$dbHost = "localhost";
$dbUser = "";
$dbPass = "";
$dbname = "";

$db = mysql_connect($dbHost,$dbUser,$dbPass);
mysql_select_db($dbname,$db);

## Start Paging
##
$cPerPage = 10; // Hversu margar færslur á síðu
$cTotal = mysql_num_rows(mysql_query("SELECT * FROM guestbook")); // Heildar færslur
$cPage = (isset($_GET["sida"]) ? $_GET["sida"] : 1); // Á hvaða síðu ertu staddur ? enginn = 1
$cPages = ceil( $cTotal / $cPerPage );
## Búum til MySQL Limit str
$cStart = ($cPage * $cPerPage) - $cPerPage;
$cEnd = $cStart + $cPerPage;
$cLimit = "LIMIT $cStart,$cEnd";

$requete = "SELECT ID, name, email, dateposted, comment
FROM guestbook ORDER BY ID desc $cLimit";

$result = mysql_query ($requete,$db);

while($row = mysql_fetch_assoc($result))
{
$name = $row['name'];
$email = $row['email'];
$comment = $row['comment'];
$datetime = $row["dateposted"];

if ($email)
echo '<a href="mailto:'.$email.'">';
echo $name;
if ($email)
echo '</a>';
echo ' - Pòstað Þann '.$datetime.'<br />';
echo ''.$comment.'';
echo '<hr />';
}

?>

<center>
<div class="pagination">
<table>
<tr>
<td><?=($cPage > 1 ? '<a href="?sida=1"><<</a>' : '<<')?></td>
<td><?=($cPage > 1 ? '<a href="?sida='.($cPage-1).'"><</a>' : '<')?></td>
<td>Síða <?=$cPage;?> af <?=$cPages;?></td>
<td><?=($cPage != $cPages ? '<a href="?sida='.($cPage+1).'">></a>' : '>')?></td>
<td><?=($cPage != $cPages ? '<a href="?sida='.$cPages.'">>></a>' : '>>')?></td>
</tr>
</table>
</div>
</center>

</body>
</html>

bluewalrus

12-26-2008, 07:21 AM

Use this with that css and work backwards

<p><a href="http://www.digg.com">Digg</a> Style (<a href="http://www.mis-algoritmos.com/wp-content/uploads/pagstyle.php?q=digg">Download CSS</a>)
<div class="digg"><span class="disabled">◄</span><span class="current">1</span><a href="#?page=2">2</a><a href="#?page=3">3</a><a href="#?page=4">4</a><a href="#?page=5">5</a><a href="#?page=6">6</a><a href="#?page=7">7</a>...<a href="#?page=199">199</a><a href="#?page=200">200</a><a href="#?page=2" class="next">►</a></div>

Disa

12-26-2008, 08:17 AM

Thx for this, working great, thx :)