Restore comment box width in a full-width layout

Using a full-width layout on a post with comments activated will result in the comment box also being displayed full-width. This is the expected behavior but you might not want that. What you would probably want is for the comment box to be displayed at the site container width set from the Customizer in Appearance -> Customize -> Layout -> Container -> Container Width.

Use the following CSS to restore the comment box to the site’s container width.

.comments-area {
    max-width: 1200px; /* Value set in the Custmomizer for the Container width */
    margin-left: auto;
    margin-right: auto;
}

You can add other selectors in there in case you make use of other functionality. For example, you would use the following CSS if you were to use the Simple Author Box plugin.

.comments-area,
.saboxplugin-wrap {
    max-width: 1200px; /* Value set in the Custmomizer for the Container width */
    margin-left: auto;
    margin-right: auto;
}

GeneratePress logo

Need help on customizing GeneratePress or GenerateBlocks?

Helpful info

Adding CSS

Adding PHP

Using a child theme

Keep up to date with newly released articles

Sign up to the Knowledge Base newsletter

You will only receive an email when new content is added in the Knowledge Base. No spam, that's a promise!