-2

i want single table multiple rows record show in single row i have code running which is showing multiple records on different rows i want to display items on single row.for example i want to display 4 products on a single row i am attaching running code which echo result like this

product 1

product 2

product 3

product 4

what i want with this code to do it echo like that

product 1    product 2     product 3    product 4 

hope so you guys understand what i want to do.

     $results = $mysqli->query("SELECT * FROM products ORDER BY id desc");
if ($results) { 

    //fetch results set as object and output HTML
    while($obj = $results->fetch_object())
    {
        echo '<div class="product">'; 
        echo '<form method="post" action="cart_update.php">';
        echo '<div class="product-thumb"><img src="img/'.$obj->product_img_name.'"></div>'; 
        echo '<div class="product-content"><h3>'.$obj->product_name.'</h3>';
        //echo '<div class="product-desc">'.$obj->product_desc.'</div>';
        echo '<div class="product-info">';
        echo 'Price '.$currency.$obj->price.' | ';
        echo 'Qty <input type="text" name="product_qty" value="1" size="3" />';
        echo '<button class="btn btn-warning btn-xs"">Add To Cart</button>';
        echo '</div></div>';
        echo '<input type="hidden" name="product_code" value="'.$obj->product_code.'" />';
        echo '<input type="hidden" name="type" value="add" />';
        echo '<input type="hidden" name="return_url" value="'.$current_url.'" />';
        echo '</form>';
        echo '</div>';
    }

}
John Conde
  • 217,595
  • 99
  • 455
  • 496
Aziz
  • 5
  • 6

1 Answers1

0

DIV is a block element. If you want it to act as an inline element you need to set that in your css.

.product {
  display:inline;
}

You've got a FORM and other DIV elements inside your product DIV, and they're all block elements as well. You can make everything inside your product DIV function as an inline element by doing this:

.product * {
  display:inline;
}

If you're not familiar with block and inline elements, you'll want to read up on that: http://www.w3schools.com/html/html_blocks.asp

Mark Leiber
  • 3,118
  • 2
  • 13
  • 22
  • this remove space between products but not putting them on same row – Aziz Apr 27 '15 at 00:18
  • Take a look at this jsfiddle and see how your HTML output differs from what you see there: https://jsfiddle.net/rv4L7yen/ – Mark Leiber Apr 27 '15 at 00:26
  • i m using while loop fetching each row record can't do like this – Aziz Apr 27 '15 at 00:35
  • all code is inside this div
    – Aziz Apr 27 '15 at 00:38
  • But ultimately you'll have a page of HTML. If your resultset has 2 records, you'll have 2
    elements. Also, it looks like you have an extra quote (right before >Add To Cart).
    – Mark Leiber Apr 27 '15 at 00:38
  • got it now its on single row but all 16 products on single row how to make the 5 or 6 each row – Aziz Apr 27 '15 at 00:44
  • and also want info and add to cart button down to product picture help me out and thanks in advance – Aziz Apr 27 '15 at 00:47
  • Regarding putting 5 per row, just wrap each set of 5 in a DIV. Use a counter in your loop and use the modulus operator (%). If the counter % 5 = 0, then that is the last item for the row and you can end the DIV. I don't understand your other comment about the placement of the info and Add to Cart button. – Mark Leiber Apr 27 '15 at 01:39
  • about placement i am saying now its showing product 1 image [its info] product image 2 [its info] next to each other i want [its info ] down to product image like this above product 1 image and [its info] down to it – Aziz Apr 27 '15 at 12:48
  • @Aziz, sorry, I'm still not understanding your meaning. I created a chat room if you want to discuss further: http://chat.stackoverflow.com/rooms/76364/question-29885075 – Mark Leiber Apr 27 '15 at 13:24