Php 在wordpress WP_查询中，将左位置和顶位置放在post循环中

我已经完成了教程中的三列布局。太棒了。但我想在“div”中包含一个样式表。现在我的朋友就这样离开了

<div class="post-col1" id="post-125">
      <h4 class="member-name"> <a href="/TantraProjects/Ranjit/mdmar/members/tshgueuj/" title="Tshgueuj">Tshgueuj </a> </h4>
      <h4 class="phone-number">34543</h4>
</div>

34543

我用过的代码是

<?php if (have_posts ()):?>
<?php $col = 1;
while($loop->have_posts()): $loop->the_post();?>
<?php if ($col == 1)?>
<div class = "post-col<?php echo $col; ?>" id = "post-<?php the_ID();?>" style=" top: 0; left: 305; ">
  <h4 class="member-name"> <a href = "<?php the_permalink(); ?>" title = "<?php the_title(); ?>"><?php the_title();?> </a> </h4>
  <h4 class="phone-number"><?php echo get_post_meta($post->ID, 'members_phone-one',true) ?></h4>


  </div>
  <?php
  if($col == 1) {$col = 2;} else {
  if($col != 1) {
  if($col == 3) {$col = 1;}
  if($col == 2) {$col = 3;}
  }
  }
  endwhile; ?>  
</div>

由于您已经分配了一类
post colN
，您可以在样式表中分配
left
属性，而不是在HTML中编码它们：

.post-col1 { left: 0; }
.post-col2 { left: 300px; }
.post-col3 { left: 600px; }

然后类似的方法应该可以工作（我还没有测试过，但希望你能纠正任何拼写错误）：


.post-col1 { left: 0; }
.post-col2 { left: 300px; }
.post-col3 { left: 600px; }

<?php if (have_posts ()):
    $col = 1;
    $top = 0;
    while($loop->have_posts()):
        $loop->the_post(); ?>
        <div class="post-col<?php echo $col; ?>" id="post-<?php the_ID();?>" style="top: <?php echo $top; ?>px;">
            <h4 class="member-name"><a href="<?php the_permalink(); ?>" title="<?php the_title(); ?>"><?php the_title(); ?></a></h4>
            <h4 class="phone-number"><?php echo get_post_meta($post->ID, 'members_phone-one',true) ?></h4>
        </div>
        <?php
        $col++;
        if ($col > 3) {
            $col = 1;
            $top += 300;
        }
    endwhile;
endif; ?>