[Resolved] One container won't enable.

[Mo]

Hi Tom,

I’ve run into an unexpected snag.

During the current site build, I’ve been using the Saparate Container setting under the Content Layout.

I was curious to see how the page would look as one container just in case the client has a preference, so the setting was changed.

Now the content area margins are gone and the sidebars do not join the content area.

I’ve tried re-adjusting the spacing of the different sections without success.

Sections had been disabled but was enabled in case this was the cause.

The contact form that was displaying perfectly in the separate containers is now broken.

It’s supposed to be a responsive contact pgae and it did work in that respect.

Any suggesstions would be appreciated.

Thanks.

[Mo]

My bad…
Contact form broken no matter the setting.

The issue remains that the one container setting doesn’t join the sections.

Thanks.

[Mo]

Update…

I disabled the spacing add-on which broke the layout even more.

Also noticed the the total width of the sidebars and content area combined is less wide than the navbars.

The total width should be 1380px however, according to an onscreen ruler the total combined width is 1300px.

FYI, recent Customizer and database settings were backed up prior to finding this issue however, it’s impossible to know when the problem might have first occured.

I’ve got database backups going back to near the beginning of the build if they are eventually required.

Thanks.

[Tom]

Hi there,

I’m not too sure what you mean – do you have a link to the site or screenshot?

[Mo]

Hi Tom:
Here’s the current state of the homepage…
Homepage

Content section has shrunk in width while the content itself appears to remain the same width with out a margin now.

Total width of sidebars and content sections is not as wide as the navbars for some reason.

“One container” has been enabled under “Layout”.

“Spacing” addon is enabled.

If one container is changed back to separate containers, it looks alright.

I have no idea when this issue actually began as it was only yesterday that the attempt was made to change the layout.

Tried re-installing GP and gp-premium… no change.

There are backups of the databases going back to the beginning of the build so if all else fails we can try those to maybe see where this happened.

Thanks

[Tom]

I’m assuming this is all being caused by some CSS in your child theme.

What happens if you remove that CSS (make a backup)?

[Mo]

You’ve pegged it as usual.

Might have something to do with the drop shadows on the separate containers.

Won’t be absolutely certain until the current css has been checked over.

Apologies for the support request.

Should’ve checked that out in the first place.

Thanks Tom.

[Mo]

Just to confirm Tom.

The box shadow does prevent “One container” from working correctly.

Makes sense since the shadow is taking up space.

Disabling the box-shadow allows the panels to join up normally.

Fortunately it was a simple fix, thanks to you.

[Tom]

Glad I could help!

Adding box shadows should work regardless as long as you add them to elements inside the structural elements.

For example, instead of adding them to the .content-area class, which also has the grid classes (grid-75 etc..) – add them to the element within the grid, like .site-main.

Hope this helps 🙂

[Author]

Posts