CSS stopped working when I upgraded the theme

Hi, I am working with wordpress with the divi theme. I wanted the header to be a certain height, and the text to be centered vertically. I went with this CSS:
/*-----------------------------------------------*/ 
/*-----Header & Slider Alignment by Divi Soup----*/ 
/*-----------------------------------------------*/
/*Fullwidth Header*/
.ds-fw-header {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: end ;
    -ms-flex-align: end;
    align-items: center/* flex-start | center */;
    padding: 0;
    min-height: 60vh; /*Adjust for header height*/
    height: 60vh; /*Adjust for header height*/
}
.ds-fw-header .et_pb_fullwidth_header_container {
    width: 100%;
    max-width: 100%;
    padding: 0;
}
.ds-fw-header .header-content {
    width: 100% !important;
    max-width: 100% !important;
    padding: 2% !important;
    margin: 0;
}

/*-----------------------------------------------*/ 
/*-----END Header & Slider Alignment by Divi Soup----*/ 
/*-----------------------------------------------*/

Open in new window


And it worked perfectly.  But then I upgraded to the latest Divi, and of course now it's broken. Can anyone help me make the header 60vh again? Site is https://techgardens.com/optical-engineering/

Thanks.
Melody ScottAsked:
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

David S.Consultant & Challenge SubduerCommented:
It seems that there may be a parsing error in "/optical-engineering/wp-content/cache/et/global/et-divi-customizer-global-15369751308298.min.css" which is causing browsers to ignore those rules.

I suggest you use the validator to check the non-minified version of that stylesheet.
Melody ScottAuthor Commented:
ok, thanks. I could also go in and add it to each module, that did work when I tried it on one.
Julian HansenCommented:
It looks like the styles are still good if you add them to your existing page.

1. Save above css to a file
2. Open site in Firefox
3. Go to the Style Editor tab
4. In left sidebar click the style upload button (rectangle with an up arrow) and load the file from 1

Does this give you the results you want?

If so - we just need to figure out why your CSS is not loading in the updated theme.

Where did you place the CSS in your theme before the upgrade?

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
Ensure Business Longevity with As-A-Service

Using the as-a-service approach for your business model allows you to grow your revenue stream with new practice areas, without forcing you to part ways with existing clients just because they don’t fit the mold of your new service offerings.

Melody ScottAuthor Commented:
Hi- Darn, I keep uninstalling Firefox because for some reason it slows my system down. Divi theme has a section to add custom css under theme options. It would be simple enough to remove the code from there and put it directly into each header, I only have 15 or so. I might do that for expediency.
Melody ScottAuthor Commented:
I thought it was loading the other CSS from that bit of code,but I was wrong. I think I'll have to load the whole code into each header individually.
Melody ScottAuthor Commented:
I think the problem was that I added a class to each header, ds-fw-header, and it wasn't accepting or showing that class.
Julian HansenCommented:
The page as you render it is fine - the ds-fw-header class exists - and if you load the style sheet it applies.

The problem seems to be that the styles are not being rendered.

Not sure what you mean by adding them to each header - as far as I can tell these should be global styles?
Melody ScottAuthor Commented:
Hi- I went ahead and removed the CSS from the css options section of the theme and added it to the CSS section of each header module, after removing the class. That worked, so I think I'll go from there. Thanks - another question coming up in an hour, so keep your eyes out for that! Thanks.
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
CSS

From novice to tech pro — start learning today.