Amirreza alibeygi Amirreza alibeygi - 18 days ago 5
PHP Question

how to separate a ul with 30 item to 3 row?

Hi I have a php code that generates a ul with 30 li I want to show this ul in 3 rows , what should I do ?

<?php
$args = array( 'hide_empty' => false, );

$terms = get_terms( 'job_region', $args );
if ( ! empty( $terms ) && ! is_wp_error( $terms ) ) {
$count = count( $terms );
$i = 0;
$all_count=wp_count_posts('job');
$published_jobs = $all_count->publish;
$term_list = '<ul class="statelist"><li class="all" count-all= ' . $published_jobs . '><a href="http://estekhdamia.com/job-listings/" title="تمام آگهی ها">تمام استان ها</a></li></ul><ul class="statelist clearfix">';
foreach ( $terms as $term ) {

$i++;
$term_list .= '<li class=' . $term->slug . ' count-all=' . $term->count . '><a href="/job-search/?location=' . $term->slug . '&submit=true" title="' . esc_attr( sprintf( __( 'نمایش آگهی های %s', 'my_localization_domain' ), $term->name ) ) . '">' . $term->name . '</a></li>';
if ( $count != $i ) {
$term_list .= " ";
}
else {
$term_list .= '</ul>';
}
}
echo $term_list;
}
?>

Answer

Here is a solution using styles:

ul li {
    display: inline;
    
}
ul li:nth-child(10n):after {
    content: " ";
    display: block;
}
<ul>
  <li>01</li>
  <li>02</li>
  <li>03</li>
  <li>04</li>
  <li>05</li>
  <li>06</li>
  <li>07</li>
  <li>08</li>
  <li>09</li>
  <li>10</li>
  <li>11</li>
  <li>12</li>
  <li>13</li>
  <li>14</li>
  <li>15</li>
  <li>16</li>
  <li>17</li>
  <li>18</li>
  <li>19</li>
  <li>20</li>
  <li>21</li>
  <li>22</li>
  <li>23</li>
  <li>24</li>
  <li>25</li>
  <li>26</li>
  <li>27</li>
  <li>28</li>
  <li>29</li>
  <li>30</li>
</ul>