title: php, how do i render 100 items in 10 rows and 10 columns
body: <p>So i have an array which contains a hundred seats or sometimes 150, I want to render the items inside but with 10 rows, instead of 1 row and 100 items, how do I do that?</p>
  
  <pre><code>  &lt;div class="container"&gt;
      &lt;ol&gt;
  &lt;-- ROW 1 START--&gt; 
          &lt;li class="row"&gt;
              &lt;ol class="seats" type="A"&gt;
                  &lt;li class="seat"&gt;
                      &lt;input type="checkbox" id="A1" /&gt;
                      &lt;label for="A1"&gt;A1&lt;/label&gt;
                  &lt;/li&gt;
              &lt;/ol&gt;
          &lt;/li&gt;
  &lt;-- ROW 1 End--&gt; 
  &lt;-- ROW 2 START--&gt; 
          &lt;li class="row"&gt;
              &lt;ol class="seats" type="A"&gt;
                  &lt;li class="seat"&gt;
                      &lt;input type="checkbox" id="A1" /&gt;
                      &lt;label for="A1"&gt;B1&lt;/label&gt;
                  &lt;/li&gt;
              &lt;/ol&gt;
          &lt;/li&gt;
  &lt;-- ROW 2 END--&gt; 
      &lt;/ol&gt;
  &lt;/div&gt;  
  </code></pre>
  
  <p>Here are the php code</p>
  
  <pre><code>&lt;?php
  require "includes\header.php";
  require "includes\database.inc.php";
  
  if (!isset($_SESSION['id'])) {
      header("Location: login.php?error=not_login");
      exit();
  }
  // SELECT * FROM seats where branch_id = 1
  $seats = $mysqli-&gt;query("SELECT * FROM seats where branch_id = 1") or die($mysqli-&gt;error);
  ?&gt;
  
    &lt;head&gt;
      &lt;link href="./css/seats.css" rel="stylesheet"&gt;
    &lt;/head&gt;
  
  
    &lt;div class="container"&gt;
      &lt;ol&gt;
          &lt;li class="row row--1"&gt;
              &lt;ol class="seats" type="A"&gt;
              &lt;?php 
                  $i=1;
                  while ($row = mysqli_fetch_array($seats)) {
              ?&gt;
                  &lt;li class="seat"&gt;
                      &lt;input type="checkbox" id="A1" /&gt;
                      &lt;label for="A1"&gt;&lt;?php echo $row['row'].$row['number'] ?&gt;&lt;/label&gt;
                  &lt;/li&gt;
                  &lt;?php } ?&gt;
          &lt;li&gt;
      &lt;/ol&gt;
  &lt;/div&gt;  
  </code></pre>
  
  <p>but it gives me this UI, which is wrong and not what I want, and when I checked the A3, it highligthed the A1 instead... </p>
  
  <p><a href="https://i.stack.imgur.com/WgwDi.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/WgwDi.png" alt="Wrong UI and wrong checked ui"></a></p>