Older posts still showing up in two columns

Hi guys!

I’ve made some changes to my page to show all posts in one column instead of two columns like it is originally but it still shows 2 columns when I click on the ‘older posts’. How can I make those older posts display the same way as my main page?

Here’s my custom CSS:

header.entry-header.page-header li.cat-item {
    display: none;
}

@media (min-width: 768px) {

    .blog.home .page-1 article.post:first-child, .blog.home .page-1 article.post:nth-child(2), .blog.home .page-1 article.post:nth-child(3), .blog.home .page-1 article.post:nth-child(4), .blog.home .page-1 article.post:nth-child(5) {
        width: 100%;
        padding: 0!important;
    }
    .blog.home .page-1 article.post:first-child .post-inner-content, .blog.home .page-1 article.post:nth-child(2) .post-inner-content, .blog.home .page-1 article.post:nth-child(2) .post-inner-content, .blog.home .page-1 article.post:nth-child(3) .post-inner-content, .blog.home .page-1 article.post:nth-child(4) .post-inner-content .post-inner-content{
        padding: 0 0 50px;
        border-bottom: none;
    }

    .blog.home .page-1 article.post:nth-child(5) .post-inner-content{
        padding: 50px 0;
        margin-bottom: 30px;
    }
    .blog.home .page-1 article.post:first-child .read-more,
    .blog.home .page-1 article.post:first-child .entry-footer,
    .blog.home .page-1 article.post:nth-child(2) .read-more,
    .blog.home .page-1 article.post:nth-child(2) .entry-footer,
    .blog.home .page-1 article.post:nth-child(3) .read-more,
    .blog.home .page-1 article.post:nth-child(3) .entry-footer,
    .blog.home .page-1 article.post:nth-child(4) .read-more,
    .blog.home .page-1 article.post:nth-child(4) .entry-footer,
    .blog.home .page-1 article.post:nth-child(5) .read-more,
    .blog.home .page-1 article.post:nth-child(5) .entry-footer {
        display: block;
    }
    .cat-title {display:none;}
    /*.single-featured {display: none;}*/
    
    #secondary .widget-title:after { display:none;}
    #secondary .widget > h3 {text-align: center;}
}

@media (min-width: 992px) {
    .col-md-8 {
        width: 70%;
    }
    .col-md-4 {
        width: 30%;
    }
    .cat-title {display:none;}
    /*single-featured {display: none;}*/
    
    #secondary .widget-title:after { display:none;}
    #secondary .widget > h3 {text-align: center;}
    
}

@media (min-width: 1200px)
.container {
    width: 1230px;
}

.navbar-brand {
    color: #000;
}

body.single-post img.single-featured {
    display: none;
}

span.site-name a.navbar-brand {
    font-family: Cabin Sketch;
    font-size: 60px;
}

div.post-inner-content a img.single-featured.wp-post-image {
    width: 100%;
    height: auto;
    max-height:100%;
    padding: 5px;
    transition: none;
}

#secondary .widget > h3{
  display: table;
  margin: 0 auto;
  top: -23px;
  z-index: 9999999;
  background: #fff;
  padding: 0px 25px;
}

#secondary .widget-title:after{
  display: none;
}
#secondary .widget{
  border: 1px solid #ccc;
  padding: 15px;
  overflow: visible;
  display: table;
  width: 100%;
}
   
.container {
    max-width: 1490px;
}

And here’s my page link:
http://intothecity.tk/

Hi @kalik,

I hope you are well today and thank you for your question.

You can achieve that by removing the following class from the above code

.page-1

Or just use the following additional CSS code.


@media (min-width: 768px) {

    .blog.home article.post:first-child, 
    .blog.home  article.post:nth-child(2), 
    .blog.home  article.post:nth-child(3), 
    .blog.home article.post:nth-child(4), 
    .blog.home article.post:nth-child(5) {
        width: 100%;
        padding: 0!important;
    }
    .blog.home article.post:first-child .post-inner-content,
     .blog.home  article.post:nth-child(2) .post-inner-content, 
     .blog.home article.post:nth-child(2) .post-inner-content,
      .blog.home article.post:nth-child(3) .post-inner-content,
       .blog.home article.post:nth-child(4) .post-inner-content .post-inner-content{
        padding: 0 0 50px;
        border-bottom: none;
    }

    .blog.home article.post:nth-child(5) .post-inner-content{
        padding: 50px 0;
        margin-bottom: 30px;
    }
    .blog.home  article.post:first-child .read-more,
    .blog.home article.post:first-child .entry-footer,
    .blog.home article.post:nth-child(2) .read-more,
    .blog.home article.post:nth-child(2) .entry-footer,
    .blog.home article.post:nth-child(3) .read-more,
    .blog.home article.post:nth-child(3) .entry-footer,
    .blog.home article.post:nth-child(4) .read-more,
    .blog.home article.post:nth-child(4) .entry-footer,
    .blog.home article.post:nth-child(5) .read-more,
    .blog.home article.post:nth-child(5) .entry-footer {
        display: block;
    }

}

Best Regards,
Movin

Great, thanks Movin!

You are most welcome here :slight_smile: