Portfolio Items CSS not working

[eb1990]

On my portfolio items pages, I added some CSS to make it look like my content was on a white paper in the middle of the screen. If I click 'customize in X Theme options (in Wordpress), the papers appear exactly how they’re supposed to (see screenshot 1). However, when I view my website in a normal browser, the white page background is gone and my content is no longer centered (see screenshot 2).

Why does it look fine when I go to customize the page but not when I view my website normally?

PLEASE NOTE:

• I posted this topic a few weeks ago (https://theme.co/apex/forum/t/portfolio-items-customization-not-working/40365/2) and I followed the steps that were suggested to me but it still didn’t work. I checked the CSS and it’s fine. I also disabled Cloudflare but the issue remained. The reason I’m reposting it is because the post seems to be locked due to inactivity.

Please advise.

Thanks

[ruenel]

Hello There,

Thanks for writing in! There are other factors why your changes did not take place in the front end. ​To assist you better with this issue, would you mind providing us the url of your site with login credentials so we can take a closer look? This is to ensure that we can provide you with a tailored answer to your situation. Once you have provided us with your URL, we will be happy to assist you with everything.

To do this, you can create a secure note with the following info:
– Link to your site
– WordPress Admin username / password
​
Thank you.

[eb1990]

Hi I added the note. Let me know!

Thanks

[ruenel]

Hello There,

Your section has a transparent background.

There are two ways you can resolved the issue.

1.) By editing each of your portfolio items in Cornerstone and make sure that the section as a white background color.

2.) Or simply make use of this custom css in the X > Theme Options > Custom CSS

/* make single portfolio with a white background like a paper */
.single-x-portfolio .entry-content.content {
    background-color: white;
}

I went ahead and proceed with option #2.

You can check your site now.

[eb1990]

Perfect, thank you! One last question. What line of code should I add to center the content in the portfolio items pages? The white page used to be in the middle on all platforms.

Let me know and thank you again.

[rad]

Hi @ericbishara,

It’s because of this CSS,

.single-x-portfolio .x-main {
    max-width: 700px !important;
} 

If you wish it to be centered, then please change it to this

.single-x-portfolio .x-main {
    max-width: 700px !important;
margin: 0 auto;
}

Hope this helps.