CSS help to change .x-container width for only the body on mobile

Hello,

I am trying to add 2 columns for the WooCommerce shop page, which I have managed to do. However, I am trying mage the .x-container width smaller to get more use out of the screen real estate.

I have done it by adding the following to the Custom CSS (and adding other CSS to reduce the margins, etc.

archive.woocommerce .x-container {
    width:99% !important;
}

However, I really only want this to apply to this page and to the body, not the header. Currently ALL archive pages are affected and the header and footer have also lost their margins. I’m not the best at CSS and finding the right selectors is a nightmare. Can anyone please help?

Thanks,

Hi @Osztreicher,

Please give us the following information in a Secure Note so that we can take a look.

  • WordPress Login URL
  • Admin level username and password

You can find the Secure Note button at the bottom of your posts.

Thank you.

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.