1

I have the following col-md-3 col-sm-6 which I'm repeating for every input in my DB table, but I need them to be surrounded by row elements for every four col-md-3or every two col-sm-6.

<?php . . . while($query_row = mysqli_fetch_assoc($query_run)){ $ref_name = $query_row ['ref_name']; $ref_company = $query_row ['ref_company']; $ref_img = $query_row ['ref_img']; $ref_modal = $query_row ['ref_modal']; ?> <div class="col-md-3 col-sm-6 outerref"> <a href="#" data-toggle="modal" data-target="<?php echo "$ref_modal"?>"> <div class="innerref"> <img src="<?php echo $ref_img?>" alt="" class="maxim img-responsive" > <h2><?php echo "$ref_name"?></h2> <h4><?php echo "$ref_company"?></h4> </div> </a> </div> <?php } . . . ?>

I have no idea how to end the row and open a new one when four col-md-3s or two col-sm-6s are outputted. Any help i appreciated.

Thanks in advance.

Improve this question

2 Answers 2

Reset to default
1

Try the belove code this will add row for every four col-md-3.

$count = 1; while($query_row = mysqli_fetch_assoc($query_run)){ $ref_name = $query_row ['ref_name']; $ref_company = $query_row ['ref_company']; $ref_img = $query_row ['ref_img']; $ref_modal = $query_row ['ref_modal']; ?> <div class="row"> <div class="col-md-3 col-sm-6 outerref"> <a href="#" data-toggle="modal" data-target="<?php echo "$ref_modal"?>"> <div class="innerref"> <img src="<?php echo $ref_img?>" alt="" class="maxim img-responsive" > <h2><?php echo "$ref_name"?></h2> <h4><?php echo "$ref_company"?></h4> </div> </a> </div> <?php if($count % 4 == 0){ echo '</div><div class="row">'; } ?> <?php $count++; } ?>

Hope this will help, you can ask if have any questions.

Improve this answer
Sign up to request clarification or add additional context in comments.

3 Comments

<div class="row"> needs to be outside the while, and it works. But still i need to do this for col-sm-6 too. Thanks tho appreciated, it helped alot.
yes right and also have to close one div end of while
i fixed tghe col-sm-6 problem. thanks :) an upvote would be nice still.
1

Use the modulo (or modulus) operator: In case of four col-md-3s, the usage will be:

<?php . . . $i=1; echo '<div class="row">';?> while($query_row = mysqli_fetch_assoc($query_run)){ $ref_name = $query_row ['ref_name']; $ref_company = $query_row ['ref_company']; $ref_img = $query_row ['ref_img']; $ref_modal = $query_row ['ref_modal']; ?> <div class="col-md-3 col-sm-6 outerref"> <a href="#" data-toggle="modal" data-target="<?php echo "$ref_modal"?>"> <div class="innerref"> <img src="<?php echo $ref_img?>" alt="" class="maxim img-responsive" > <h2><?php echo "$ref_name"?></h2> <h4><?php echo "$ref_company"?></h4> </div> </a> </div> <?php if ($i%4==0){echo '</div> <div class="row">';}?> <?php $i++; } <?php echo '</div> '; . . . ?>

You can use two different counters, and two different div for col-md-3 and col-sm-6 and cleverly use the modulus operator;

Improve this answer

3 Comments

you forgot $i++; it works after adding that. But still i need to do this for col-sm-6 too. Thanks though appreciated, it helped alot.
thanks, fixed. and i haven't tested it as i have not the db this caused the problem.
actually i kinda fixed the col-sm-6 problem. thanks :) an upvote wouldnt be bad tho.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.