Wordpress Posts Page - loop is not showing latest post

Question

I am relatively new to php.

I have a loop in place for my Wordpress posts page - The posts have to alternate between left and right alignments.

I have this working by assigning an even or odd class to each post, however now the latest post does not display on the posts page.

For example, if I have say 5 posts; 4 of the posts will display and the latest post will remain hidden until I make a new post - the previously hidden post will then join the others and the new "latest post" will remain hidden.

I can't figure out why my loop is skipping over the first post, I have already tried adding rewind_posts(); however this created an infinite loop of the same post.

Any help is much appreciated!

<?php 
$postcount=1;
while(have_posts()) :        
    if( ($postcount % 2) == 0 ) $post_class = ' even';
    else $post_class = ' odd'; 

    ?>

 <div class="row">
 <div id="stories-box-alt" class="stories-column-circle-main" 
 style="background-color:transparent;">
 <div id="circle-shape" class="post <?php echo $post_class; ?>">            
 <?php the_post(); ?>


 <img src="<?php the_field('post_preview_image'); ?>" class="curve">    

 <h2><?php the_title(); ?></h2>

 <h3><span class="featured-title"><?php the_field('post_category'); ?> . 
 </span></h3>

 <p><?php the_field('post_preview'); ?><br><a href="<?php the_permalink(); 
 ?>">read more...</a></p>

 </div>
 </div>           
 </div>
 <?php $postcount++;
        endwhile; ?>

Answer 1

<?php 
$postcount=1;
while(have_posts()) :        

    ?>

 <div class="row">
 <div id="stories-box-alt" class="stories-column-circle-main" 
 style="background-color:transparent;">
 <div id="circle-shape" class="post <?php if(($postcount % 2) == 0){  ?> even <?php } else{ echo " odd"; }?>">            
 <?php the_post(); ?>


 <img src="<?php the_field('post_preview_image'); ?>" class="curve">    

 <h2><?php the_title(); ?></h2>

 <h3><span class="featured-title"><?php the_field('post_category'); ?> . 
 </span></h3>

 <p><?php the_field('post_preview'); ?><br><a href="<?php the_permalink(); 
 ?>">read more...</a></p>

 </div>
 </div>           
 </div>
 <?php $postcount++;
        endwhile; ?>

OR

<?php echo $postcount % 2 == 0 ? ' even ': ' odd '; ?>