This is driving me bonkers, as I recall it worked the other day.

I can’t center the image on single post page. Tried different classes, even implemented bootstrap, which should not be needed for such a simple page. It worked perfectly on posts page archive and latest posts on home page.

What am I missing? It’s styled in SASS, shouldn’t be a conflict with CSS.

Thanks in advance!

#singlepost{
  .blog-image {
        margin: 0 auto;
    }
    h1 {
        color: #fff;
        @include PTSansNarrowRegular;
        font-size: 50px;
        color:  black;
        line-height: 45px;
        letter-spacing: -1.5px;
        max-width: 900px;
        margin: 0 auto 27px auto;
        /*text-align: center;
        padding: 20px;*/
    }
    p {
        padding-left: 60px;
        padding-right: 60px;
        text-align: justify;
        padding-bottom: 30px;
    }
}
<? get_header(); ?>
<section id="singlepost">
    <div class="container">
        <div class="row">
            <div class="col-sm-12"><h1><? the_title(); ?></h1></div>
            <div class="col-sm-12 image-responsive blog-image"> 
                <? the_post_thumbnail('full'); ?>
            </div>
            <div class="col-sm-12"> 
                <p><? the_content(); ?></p>
            </div>
        </div>
    </div>
</section>    
<? get_footer(); ?>

Read more here: Center ‘the_post_thumbnail’ on single post page WordPress


Solution:

If you know the solution of this issue, please leave us a reply in Comment section, to update the question.


Wordpress related questions and answers: