Выровнять последнее li в столбце слева

Question

Я пытаюсь сделать интервал между li, но проблема в том, что последний li в столбце не плавает до максимума слева от ширины столбца. Вот скриншот:

и вот код:

<li> 
    <div class="fimg"><a href="<?php the_permalink();?>"><?php the_post_thumbnail('recent-thumbnails'); ?></a></div> 
    <a class="fimga" href="<?php the_permalink(); ?>"><?php the_title();?></a> 
</li> 

CSS:

.latest-news ul { 
} 
.latest-news ul li { 
    display: inline-block; 
    width: 250px; 
    height: 230px; 
    margin-left: 0px; 
    overflow: hidden; 
    margin-right: 32px; 
} 
.latest-news .fimg { 
    width: 250px; 
    display: block; 
    height: 180px; 
    margin: 0; 
    overflow: hidden; 
    padding: 0; 
} 

и вот функция, которую я использовал, чтобы получить последние сообщения:

function ensan_LatestNews() { 
    $rPosts = new WP_Query(); 
    $rPosts->query('showposts=8'); 
     while ($rPosts->have_posts()) : $rPosts->the_post(); ?> 
      <li> 
       <div class="fimg"><a href="<?php the_permalink();?>"><?php the_post_thumbnail('recent-thumbnails'); ?></a></div> 
       <a class="fimga" href="<?php the_permalink(); ?>"><?php the_title();?></a> 
      </li> 
     <?php endwhile; 
    wp_reset_query(); 
} 

Answer 1

Вы имеете 4 лис в строке с помощью PHP:

$style = ($i % 4 == 0) ? 'class="last-li"' : null; 

Затем в файле CSS:

.last-li{margin-left:0 !important;} 

Имейте в виду, что если вы хотите, чтобы дизайн реагировать вы должны дайте li остатку назад.

В любом случае функция будет:

function ensan_LatestNews() { 

    $rPosts = new WP_Query(); 
    $rPosts->query('showposts=8'); 
    $i = 0; 
      while ($rPosts->have_posts()) : $rPosts->the_post(); 

     $i++; 
     $style = ($i % 4 == 0) ? 'class="last-li"' : null; 

     ?> 
     <li <?=$style?>> 
      <div class="fimg"><a href="<?php the_permalink();?>"><?php the_post_thumbnail ('recent-thumbnails'); ?></a></div> 
<a class="fimga" href="<?php the_permalink(); ?>"><?php the_title();?></a> 
     </li> 
     <?php endwhile; 
      wp_reset_query(); 
} 

Answer 2

Я думаю, что п-я это лучший способ.

.latest-новости уль ли: п-й ребенок (2n) {

}

для получения дополнительной информации смотрите по этой ссылке CSS Tricks