简体   繁体   English

侧栏显示在帖子内容下面而不是旁边(Wordpress)

[英]sidebar displaying below post content instead of beside (Wordpress)

Live site 直播网站

In trying to make my sidebar dynamic, something happened that caused my entire sidebar to be pushed from the right side of the blog container to below all post content. 在尝试使我的侧边栏动态时,发生的事情导致我的整个侧边栏从博客容器的右侧推到所有帖子内容的下方。 I've not experience this problem before- I can typically do it without issue- so I'm not certain what to look for. 我之前没有遇到过这个问题 - 我通常可以毫无问题地做到这一点 - 所以我不确定该寻找什么。 Any ideas? 有任何想法吗?

HTML/PHP HTML / PHP

<?php get_header( 'blog');?>

    <div id="blog-container">       
        <div id="blog">
            <?php if (have_posts()) : ?>
            <?php while (have_posts()) : the_post(); ?>
            <div class="post-title">
                <h3><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h3>
            </div><!-- end post-title -->
            <div class="post">
                <?php the_content('read more..'); ?>
            <div class="post-meta">
                <p><?php the_date(); ?> | <?php the_tags('tags:', ', ', ''); ?> | <?php comments_number( '0', '1 comment', '% comments' ); ?></p>
                <?php comments_template(); ?>
            </div><!-- end post-meta -->
                <?php endwhile; ?>
                <?php else : ?>
                    Nothing found.
                <?php endif;?>
            </div><!-- end post -->
        </div><!-- end blog -->
        <?php get_sidebar(); ?>
        <?php get_footer(); ?>
    </div><!-- end blog-container -->

CSS CSS

#sidebar {
    float: right;
    margin-top: 80px;
    padding-right: 10px;
    position: relative;
    width: 300px;
}

.blog-social {
    clear: both;
    padding-bottom: 20px;
    text-align: center;
}

.blog-social ul li {
    display: inline;
    padding-right: 10px;
}

.blog-social ul li:last-child {
    padding-right: 0px;
}

#sidebar .social-heading {
    text-align: center;
}

#sidebar #twitter-feed {
    font-family: podkova;
    font-size: 80%;
    color: #333333;
    letter-spacing: 1px;
    line-height: 1.5;
    padding-top: 20px;
    padding-bottom: 20px;
    width: 280px;
}

#sidebar #twitter-feed ul li {
    padding-bottom: 10px;
}

#sidebar #instagram-feed {
    padding-top: 20px;
    padding-bottom: 20px;
}

It looks like an element is missing a closing tag, so your sidebar is being rendered inside the #blog div. 看起来元素缺少结束标记,因此您的侧边栏正在#blog div中呈现。 Try moving </div><!-- end post --> above <?php endwhile; ?> 尝试移动</div><!-- end post --> <?php endwhile; ?> <?php endwhile; ?> . <?php endwhile; ?>

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM