-1

我有两个几乎相同的 WordPress 类别模板文件，它们在浏览器中的显示方式不同。

此页面底部的黑色带应延伸到页面的整个宽度，就像在此页面上一样，但由于某种原因它没有。

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

正确样式的模板文件的代码如下：

<?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>

在此先感谢您的帮助。

4

1 回答 1

0

我首先注意到您在while(have_posts())( <div <?php post_class(); ?>>) 中有一个开始标签，但无论是否有帖子，都包含结束标签。

另外，请查看您的来源（或者更好的是，获取 Firebug）。在不正确的示例中，您的<footer>元素位于 inside <div id="page-container">，而在另一个元素中则位于其下方。您的来源是否比您发布的部分更多，因为我看不到get_footer();任何一个示例的调用？

于 2013-07-25T15:03:51.560 回答