Content area size

Hello, one of my clients is asking if I could reduze the size of the content area. Is there a css solution? I tried a code that I found but nothing is changing.

    .page-template-page_front-page .container.content-wrapper {
        width: 70%;
    }

https://zuhaus.de

Hi,

Thank you for contacting.

If I got your query correctly, you’d add the below CSS code to Appearance > Customize > Additional CSS from dashboard.

    @media only screen and (min-width: 992px) {
      .home .page-wrap > .container {
        width: 920px;
      }
    }

Regards,
Kharis
aThemes Support

Thank you for your answer. The code works but only on the main homepage. Is it possible to change it so it works on all pages?

Hi,

You’re welcome!

To make it works on all pages, try removing the .home selector as it is specific to the homepage. So the code will look like this:

    @media only screen and (min-width: 992px) {
      .page-wrap > .container {
        width: 920px;
      }
    }

Regards,
Kharis
aThemes Support

It seems like everything that is set to full width via elementor is not reactiong to the code. Is there a way to fix that and keep the elementor background wide and the content fitted to the settings of the code?

Hi,

Can you point me to the specific section needing help with by sharing a screenshot and put some annotations in it?

Regards,
Kharis
aThemes Support

Hello, the css code is working where you can see the image but not at the lower part. The lower part is set to full width cause the background is using a light colour gradient. The colour gradient shoouldn´t be boxed, just the conent like text, buttons etc.

Hi,

I checked your homepage and it doesn’t show the section as seen on your screenshot. Or maybe that part was removed? Can you confirm?

Perhaps the section width is set to full width on the Elementor section setting. But you didn’t notice it.

I’d request checking your section’s settings.

Regards,
Kharis
aThemes Support

Hello, some pages are in the background. https://zuhaus.de/start/

Yes it´s set to full width because we want the full background but reduce the conent area.

Hello I just found a way to solve this via the global elementor settings. Now the content area is smaller also on full width to keep the wide background. :ok_hand:

1 Like

Great!

Glad to know you got the exact solution by yourself. And thank you for sharing it here, that’s much appreciated.

Please let us know in a new topic if you have any further questions, or if we can provide you with any other assistance.

Regards,
Kharis
aThemes Support