如何在圖像下顯示多個相等列的WordPress博客帖子？

Question

我試圖顯示所有博客文章，如雜志文章。 請參閱下面的鏈接了解確切的格式。

http://imgur.com/a/jKAlM

single.php中

<div class="container-fluid">
    <div class="row-fluid">
        <div class="col-xs-12 main-blog">

            <?php 

        if(have_posts()):

            while(have_posts()): the_post(); ?> 

                <?php the_title('<h1 class="entry-title">', '</h1>'); ?>

                <article id="post-<?php the_ID(); ?>" <?php post_class(); ?


                <div class="article-single">

                <p><?php the_content(); ?></p>

                </article>

            <?php endwhile;

        endif;


        ?>

        </div>
    </div>
</div>

CSS

.article_single {

    column-width: 150px;
    -webkit-column-width: 150px;
    -moz-column-width: 150px;
    column-gap: 30px;
    -webkit-column-gap: 30px;
    -moz-column-gap: 30px;
    font-family: Garamond;
    column-count: 3;


}

無論我對內容做什么，也會調整圖像大小。 如何在不弄亂圖像的情況下顯示內容？

Answer 1

不確定你的問題究竟是什么，因為這里沒有顯示特色圖片的電話，但值得指出你的：

<div class="article-single">

在任何地方都沒有結束</div>標簽。 這可能是你的布局。 好像它應該在你的</article>

Answer 2

我通過添加精選圖片調用解決了這個問題。 謝謝！

<div class="container-fluid">
    <div class="row-fluid">
        <div class="col-xs-12 main-blog">



            <?php 

        if(have_posts()):

            while(have_posts()): the_post(); ?> 

                <?php the_title('<h1 class="entry-title">', '</h1>'); ?>

                <article id="post-<?php the_ID(); ?>" <?php post_class(); ?   >>








                 <?php if(has_post_thumbnail()): ?>

                    <div class="text-center"><?php the_post_thumbnail('large'); ?></div>

                <?php endif; ?>

                <div class="article_single">

                <p><?php the_content(); ?></p>


                </article>





            <?php endwhile;

        endif;


        ?>

    </div>
</div>