...

View Full Version : Help with CSS layout.



nysmenu
12-25-2009, 05:00 PM
Guys, I'm trying to add CSS to a pagination script. I can't get this CSS script to display text to the right of the image. Can someone please advice on what I'm missing? Thank you and happy holidays. Please see codes below.


<?php
/*
Place code to connect to your DB here.
*/
$username="";
$password="";
$database="pagination";

$dbh=mysql_connect(localhost,$username,$password) or die ('I cannot connect to the database because: ' . mysql_error());
@mysql_select_db($database);
// include your code to connect to DB.

$tbl_name="louie"; //your table name
// How many adjacent pages should be shown on each side?
$adjacents = 3;

/*
First get total number of rows in data table.
If you have a WHERE clause in your query, make sure you mirror it here.
*/
$query = "SELECT COUNT(*) as num FROM $tbl_name";
$total_pages = mysql_fetch_array(mysql_query($query));
$total_pages = $total_pages[num];

/* Setup vars for query. */
$targetpage = "index.php"; //your file name (the name of this file)
$limit = 5; //how many items to show per page
$page = $_GET['page'];
if($page)
$start = ($page - 1) * $limit; //first item to display on this page
else
$start = 0; //if no page var is given, set start to 0

/* Get data. */
$sql = "SELECT image_path, title, image_text FROM $tbl_name ORDER BY id DESC LIMIT $start, $limit";
$result = mysql_query($sql);




/* Setup page vars for display. */
if ($page == 0) $page = 1; //if no page var is given, default to 1.
$prev = $page - 1; //previous page is page - 1
$next = $page + 1; //next page is page + 1
$lastpage = ceil($total_pages/$limit); //lastpage is = total pages / items per page, rounded up.
$lpm1 = $lastpage - 1; //last page minus 1

/*
Now we apply our rules and draw the pagination object.
We're actually saving the code to a variable in case we want to draw it more than once.
*/
while($row = mysql_fetch_array($result)){
echo "<img src='{$row['image_path']}' alt=' ' /><br />";
echo "".$row['title']."<br />";
echo "".$row['image_text']."<br />";
}
$pagination = "";
if($lastpage > 1)
{
$pagination .= "<div class=\"pagination\">";
//previous button
if ($page > 1)
$pagination.= "<a href=\"$targetpage?page=$prev\"> previous</a>";
else
$pagination.= "<span class=\"disabled\"> previous</span>";

//pages
if ($lastpage < 7 + ($adjacents * 2)) //not enough pages to bother breaking it up
{
for ($counter = 1; $counter <= $lastpage; $counter++)
{
if ($counter == $page)
$pagination.= "<span class=\"current\">$counter</span>";
else
$pagination.= "<a href=\"$targetpage?page=$counter\">$counter</a>";
}
}
elseif($lastpage > 5 + ($adjacents * 2)) //enough pages to hide some
{
//close to beginning; only hide later pages
if($page < 1 + ($adjacents * 2))
{
for ($counter = 1; $counter < 4 + ($adjacents * 2); $counter++)
{
if ($counter == $page)
$pagination.= "<span class=\"current\">$counter</span>";
else
$pagination.= "<a href=\"$targetpage?page=$counter\">$counter</a>";
}
$pagination.= "...";
$pagination.= "<a href=\"$targetpage?page=$lpm1\">$lpm1</a>";
$pagination.= "<a href=\"$targetpage?page=$lastpage\">$lastpage</a>";
}
//in middle; hide some front and some back
elseif($lastpage - ($adjacents * 2) > $page && $page > ($adjacents * 2))
{
$pagination.= "<a href=\"$targetpage?page=1\">1</a>";
$pagination.= "<a href=\"$targetpage?page=2\">2</a>";
$pagination.= "...";
for ($counter = $page - $adjacents; $counter <= $page + $adjacents; $counter++)
{
if ($counter == $page)
$pagination.= "<span class=\"current\">$counter</span>";
else
$pagination.= "<a href=\"$targetpage?page=$counter\">$counter</a>";
}
$pagination.= "...";
$pagination.= "<a href=\"$targetpage?page=$lpm1\">$lpm1</a>";
$pagination.= "<a href=\"$targetpage?page=$lastpage\">$lastpage</a>";
}
//close to end; only hide early pages
else
{
$pagination.= "<a href=\"$targetpage?page=1\">1</a>";
$pagination.= "<a href=\"$targetpage?page=2\">2</a>";
$pagination.= "...";
for ($counter = $lastpage - (2 + ($adjacents * 2)); $counter <= $lastpage; $counter++)
{
if ($counter == $page)
$pagination.= "<span class=\"current\">$counter</span>";
else
$pagination.= "<a href=\"$targetpage?page=$counter\">$counter</a>";
}
}
}

//next button
if ($page < $counter - 1)
$pagination.= "<a href=\"$targetpage?page=$next\">next </a>";
else
$pagination.= "<span class=\"disabled\">next </span>";
$pagination.= "</div>\n";
}
echo "\n".$pagination;
?>

and the CSS:


.pag {
height: 1500px;
width: 600px;
font-family: "Comic Sans MS", cursive;
font-size: 14px;
font-style: normal;
line-height: normal;
font-weight: bolder;
font-variant: normal;
text-transform: capitalize;
color: #F00;
text-decoration: blink;
overflow: hidden;
position: static;
text-align:left;
top:auto;
white-space : wrap;
background-color:#FFF;
background-position:left;
background-image:inherit;
border-bottom:dotted;
border-bottom-color:#333;

}

Above CSS does everything requested but displaying text to the right of the image.

vineet
12-26-2009, 04:47 AM
it would be better if you post your html in this forum.

or show us an online link to page.

vineet

VIPStephan
12-26-2009, 02:06 PM
Yeah, CSS is styling HTML, not PHP, so show us the output source code. And this means the entire code, not just a snippet. The issue often is caused in a different place than where it becomes obvious.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum