Okay
  Print

How to Make the Post Content Wider

Please navigate to "Appearance > Customize > Additional CSS" and place the code below:

.article-content-inner {
    max-width: 100%;
}
@media all and (min-width: 760px) {
    .article-content-outer {
        margin: 60px 50px;
    }
}
@media all and (min-width: 1080px) {
    .article-content-outer-sidebar {
        margin: 60px 50px;
    }
}

Here's the result:


You can increase/decrease the 50px values in the code as you wish. Please keep in mind that you should change all of the 50px values with the same value you prefer.

The original value is 100px. Lower value means wider content. So if you decrease this value, your content will be larger (wider).

The code above makes the post content wider. If you want to change not only the post content but also the author box and comments box, this code would do the trick:

.article-content-inner {
    max-width: 100%;
}
@media all and (min-width: 760px) { 
    .article-content-outer {
        margin: 60px 50px;
    }
    .author-box-inner {
        padding: 40px 50px;
    }
    .comments-outer .comments-inner {
        padding: 40px 50px 0 50px;
    } 
    .comments-outer .comment-respond {
        padding: 0 50px 60px 50px;
    } 
    .comments-outer h2.comments-title {
        padding: 60px 50px 0 50px;
    }
}
@media all and (min-width: 1080px) { 
    .article-content-outer-sidebar {
        margin: 60px 50px;
    }
    .author-box-inner-sidebar {
        padding: 40px 50px;
    }
    .comments-outer-sidebar .comments-inner {
        padding: 40px 50px 0 50px;
    }
    .comments-outer-sidebar .comment-respond {
        padding: 0 50px 60px 50px;
    } 
    .comments-outer-sidebar h2.comments-title {
        padding: 60px 50px 0 50px;
    }
}

Again, you should change all of the 50px values with the same value you prefer.