Skip Navigation

[Resolved] Archive layout display bug with Astra on xs view

This thread is resolved. Here is a description of the problem and solution.

Problem:Stretched, full-width archives behave differently than stretched, full-width posts.

Solution: Add this to your Layouts CSS:

.post-type-archive #main > .ast-row {
    margin-right: 0;
    margin-left: 0;
}
This support ticket is created 6 years ago. There's a good chance that you are reading advice that it now obsolete.

This is the technical support forum for Toolset - a suite of plugins for developing WordPress sites without writing PHP.

Everyone can read this forum, but only Toolset clients can post in it. Toolset support works 6 days per week, 19 hours per day.

Sun Mon Tue Wed Thu Fri Sat
8:00 – 12:00 8:00 – 12:00 8:00 – 12:00 8:00 – 12:00 8:00 – 12:00 - -
13:00 – 17:00 13:00 – 17:00 13:00 – 17:00 13:00 – 17:00 13:00 – 17:00 - -

Supporter timezone: America/New_York (GMT-04:00)

This topic contains 2 replies, has 2 voices.

Last updated by Ian Henderson 6 years ago.

Assisted by: Christian Cox.

Author
Posts
#1110304
post2.jpg
archive2.jpg
post1.jpg
archive1.jpg

I have picked up what seems like a bug with Astra integration with Layouts. The display of the bootstrap container seems inconsistent between post and archive layouts. Please look at this test site I have created to display the error.

When viewing an archive layout hidden link on mobile/xs size, the padding at the side of the container collapses - but only on an archive layout, and not on a post layout. This is causing havoc on a production site because none of the row/column padding is presenting correctly.

This is achieved by selecting 'Full Width/Stretched/ as the option for 'Default Container' in the Astra layout settings, and then making the row as wide as the Bootstrap .container in the layout.

This is an absolutely standard installation of WordPress with Toolset plugins and Astra parent theme with Astra Pro options plugin. The issue can be replicated on any installation.

#1110734

It looks like the Astra theme adds a wrapper element with the class "ast-row" to archive containers. That class CSS adds negative left and right margins, which cause the container to extend to the page edges on archives. I added this CSS snippet to your Layouts CSS editor to resolve this issue:

.post-type-archive #main > .ast-row {
    margin-right: 0;
    margin-left: 0;
}

Can you take a quick look and confirm it's behaving more like you'd expect now? This code will be applied to all post, page, and custom post type archives. I can add limitations to that if you'd like.

#1112228

Thanks Christian - that seems to do it. Perhaps add to next Layouts version so that others don't run into it? cheers

This ticket is now closed. If you're a Toolset client and need related help, please open a new support ticket.