类似结构化的WordPress模板文件产生不同的CSS样式

-1

我有两个几乎相同的WordPress类别模板文件，在浏览器中显示的方式不同。类似结构化的WordPress模板文件产生不同的CSS样式

在this page底部的黑色条带应在整个页面的整个宽度上延伸，像它在this page，但由于某些原因，它没有。

这两个类别模板文件的结构都是相同的（据我所知）并使用相同的样式表，所以我不知道浏览器为什么显示不同。给不正确样式的页面添加一个额外的关闭似乎可以解决这个问题，但我无法弄清楚为什么在一个模板文件中需要额外关闭，而不是另一个。

为正确风格模板文件中的代码如下：

<?php get_header(); ?> 

<body class="projects"> 

<div id="page-container"> 

    <?php get_sidebar(); ?> 

    <div id="content"> 
     <?php if (have_posts()) : ?> 
     <?php while (have_posts()) : the_post(); ?> 

     <div <?php post_class(); ?>> 

      <div class="post-container"> 

       <div class="post-title"> 
        <span class="date"><?php the_time('F j, Y'); ?></span><h3><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a><h3> 
       </div> 

       <div class="post-content"> 
        <?php the_content(''); ?>  
       </div> 

       <div class="post-footer"> 
        <p>BY:</p><div class="post-footer-item"><?php the_author_posts_link(); ?></div><p>CATEGORY:</p><div class="post-footer-item"><?php the_category(', '); ?></div><div class="post-footer-action"><a href="<?php the_permalink(); ?>"><p><?php comments_number('0','1','%'); ?></p><img id="comments" src="<?php bloginfo('template_directory'); ?>/images/comments.png" height=20px></a></div><div class="post-footer-action"><a href="#"><p>44</p><img id="likes" src="<?php bloginfo('template_directory'); ?>/images/likes.png" height=20px></a></div> 
       </div> 

      </div> 

     <?php endwhile; ?> 

      <div id="more-posts"> 
       <a href="<?php next_posts_link(''); ?>"><img src="<?php bloginfo('template_directory'); ?>/images/more.png" width=200></a> 
      </div> 

     </div> 

     <?php endif; ?> 

    </div> 

</div>

为不正确风格模板的代码如下：

<?php get_header(); ?> 

<body class="adventures"> 

<div id="page-container"> 

    <?php get_sidebar(); ?> 

    <div id="content"> 
     <?php if (have_posts()) : ?> 
     <?php while (have_posts()) : the_post(); ?> 

     <div <?php post_class(); ?>> 

      <div class="post-container"> 

       <div class="post-title"> 
        <span class="date"><?php the_time('F j, Y'); ?></span><h3><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h3> 
       </div> 

       <div class="post-content"> 
        <?php the_content(''); ?>  
       </div> 

       <div class="post-footer"> 
        <p>BY:</p><div class="post-footer-item"><?php the_author_posts_link(); ?></div><p>CATEGORY:</p><div class="post-footer-item"><?php the_category(', '); ?></div><div class="post-footer-action"><a href="<?php the_permalink(); ?>"><p><?php comments_number('0','1','%'); ?></p><img id="comments" src="<?php bloginfo('template_directory'); ?>/images/comments.png" height=20px></a></div><div class="post-footer-action"><a href="#"><p>44</p><img id="likes" src="<?php bloginfo('template_directory'); ?>/images/likes.png" height=20px></a></div> 
       </div> 

      </div> 

     <?php endwhile; ?> 

      <div id="more-posts"> 
       <a href="<?php next_posts_link(''); ?>"><img src="<?php bloginfo('template_directory'); ?>/images/more.png" width=200></a> 
      </div> 

     </div> 

     <?php endif; ?>   

    </div> 

</div>

在此先感谢您的帮助。

来源

2013-07-25 nickb

为什么你问这个问题两次？重复是[这里]（http://stackoverflow.com/questions/17848474/why-is-the-styling-of-these-nearly-identical-pages-different）。 –

我首先注意到你在while(have_posts())（<div <?php post_class(); ?>>）内有一个开始标签，但是不管是否有帖子，都包含结束标签。

另外，看看你的来源（或更好的，得到萤火虫）。在该示例中，这是不正确的，您的<footer>元素位于<div id="page-container">之内，而在另一个元素中位于其下方。是否有更多来源于您发布的部分，因为我无法在两个示例中看到对get_footer();的调用？

来源

2013-07-25 15:03:51

类似结构化的WordPress模板文件产生不同的CSS样式

回答

相关问题