SitePoint Sponsor

User Tag List

Results 1 to 6 of 6
  1. #1
    SitePoint Zealot
    Join Date
    May 2004
    Location
    London
    Posts
    155
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    a layout issue from a mysql query

    Hi

    I’m trying to display some thumbnail images I have via a mysql query.

    The problem I have though is in trying to achieve a certain layout.

    I want a row of three individual items then another three underneath and so on.

    basically a replica of this…… http://www.templatemonster.com/categ...hor=0&x=24&y=8

    What I’ve always been used to in the past is outputting one item per row, where as this would be three database rows in one html table row.

    is there possibly abit of code that could put in a line break each time three items are displayed.

    while($row = mysql_fetch_array($query))
    {
    // abit of code here to put in a line break after 3 items
    echo row[‘item’];
    }

    Or perhaps someone could suggest another way.

  2. #2
    SitePoint Addict
    Join Date
    Nov 2004
    Location
    London
    Posts
    248
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Two thoughts:

    Use a counter that increments every loop. When it gets to 2 (if you start from 0), add a break and reset to 0. (or use modulus)

    Go the CSS route: echo the the thumnails one after another without a break. Wrap the whole thing in a div that's wide enough for three, then float all the images left.
    Last edited by GaryS; Jul 6, 2006 at 07:14.

  3. #3
    SitePoint Member
    Join Date
    Jun 2006
    Posts
    13
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Use a counter that increments every loop. When it gets to 2 (if you start from 0), add a break and reset to 0. (or use modulus)
    PHP Code:
    echo "\n\t<table>";
    echo 
    "\n\t\t<tr>";
    $counter0;
    while(
    $rowsmysql_fetch_array($query)){
        
    $counter++;
        echo 
    "\n\t\t\t<td>";
        echo 
    '<img src="img.php?id='.$rows['image_id'].'" title="'.$rows['image_title'].'"  alt="'.$rows['image_title'].'" 
        border="0" height="128" width="128" />'
    ;
            echo 
    "</td>";
                    
    // cols break at 3
            
    if($counter==3){
                
    $counter=0;
                echo  
    "\n\t\t</tr>";
                echo  
    "\n\t\t<tr>";
            }
        }
        echo 
    "\n\t\t</tr>";
        echo 
    "\n\t</table>"
    Watch out the '<td>',

  4. #4
    SitePoint Guru rockit's Avatar
    Join Date
    Sep 2005
    Location
    Canada
    Posts
    636
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    using the table approach will technically work but it's kind of an older way of doing things. USE CSS whenever possible in these matters.

  5. #5
    SitePoint Addict
    Join Date
    Nov 2004
    Location
    London
    Posts
    248
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    ... and here's a good reason to go the CSS route: looks what it does to nk913's code:

    PHP Code:
    echo "\n\t<div class="container">";

    while(
    $rowsmysql_fetch_array($query)){
       
        echo 
    '<img src="img.php?id='.$rows['image_id'].'" title="'.$rows['image_title'].'"  alt="'.$rows['image_title'].'" border="0" height="128" width="128" />';
          
    }
        
    echo 
    "\n\t</div>"

  6. #6
    SitePoint Member
    Join Date
    Jun 2006
    Posts
    13
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Okay, I'm agree with rockit & GaryS


Bookmarks

Posting Permissions

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