Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3
  1. #1
    Regular Coder
    Join Date
    Jul 2009
    Posts
    143
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Help with CSS layout.

    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 Code:
    <?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 + ($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 + ($adjacents 2))    //enough pages to hide some
            
    {
                
    //close to beginning; only hide later pages
                
    if($page + ($adjacents 2))        
                {
                    for (
    $counter 1$counter + ($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 - (+ ($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:

    Code:
    .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.

  • #2
    Regular Coder
    Join Date
    Jun 2008
    Posts
    173
    Thanks
    2
    Thanked 9 Times in 9 Posts
    it would be better if you post your html in this forum.

    or show us an online link to page.

    vineet

  • #3
    The fat guy next door VIPStephan's Avatar
    Join Date
    Jan 2006
    Location
    Halle (Saale), Germany
    Posts
    8,486
    Thanks
    6
    Thanked 981 Times in 954 Posts
    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.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •