-1

[ Found a solution! I will post the code tomorrow. Anyways, thanks again for helping me out. :) ]

This is my code for displaying all of the posts in my blog. But I'm trying to display three different posts (in one row) and it's not working. I've already checked out some of the similar problems regarding to this but it's only for arranging the position of the image like this: align 3 images in same row with equal spaces?

Check out this screenshot for more details: IMG2

Php code:

<?php

    $query = "SELECT * FROM posts WHERE post_category_id=1";
    $select_all_posts_query = mysqli_query($connection, $query);

      while($row = mysqli_fetch_assoc($select_all_posts_query)){
            $post_id = $row['post_id'];
            $post_title = $row['post_title'];
            $post_author = $row['post_author'];
            $post_date = $row['post_date'];
            $post_image = $row['post_image'];
            $post_content = $row['post_content'];
?>

Note: It's only one row because it automatically display all the posts with that same format as I declare from the php code above.

    <div class="container">
    <div class="row">  
     <div class="block col-sm-4 col-sm-4 col-sm-4">
     <img class="img-rounded img-responsive center" src="images/<?php echo $post_image?>">
    <a href="post.php?p_id=<?php echo $post_id; ?>"><h4><?php echo $post_title?></h4></a>
     <p><span class ="glyphicon glyphicon-time"></span> Posted on <?php echo $post_date?> | by <?php echo $post_author?></p>
    <p align="justify"><?php echo $post_content?></p>
     <a href="#" class="btn btn-default" role="button">Read More</a>
    <p>&nbsp;</p>
    </div>          
     </div> 
<?php } ?>
    </div>
Community
  • 1
  • 1
28 MLZ
  • 1
  • 4

1 Answers1

2

If you want 3 columns in one row, then the row div should contain 3 divs with class="col-sm-4".

<div class="container">
    <div class="row">  
        <div class="block col-sm-4">
            Column 1 Elements
        </div>
        <div class="block col-sm-4">
            Column 2 Elements
        </div>
        <div class="block col-sm-4">
            Column 3 Elements
        </div>          
    </div> 
</div>
4castle
  • 32,613
  • 11
  • 69
  • 106
  • Yes, I tried that. Thanks for the help though. It's a solution for having 3 columns in a row. But my problem is, it has the same value on those three columns. Check out the IMG2 on the screenshot. I guess it's not possible when php is added? – 28 MLZ Apr 09 '16 at 16:56
  • In a real production situation, the 3 columns will have different values. In the mean time, just copy/paste the code into each of the columns. When you want something to display 3 times, the source code has to have it 3 times. PHP wouldn't break anything. – 4castle Apr 09 '16 at 17:05