New Jan 5, 2025

React app build not applying some CSS declarations

Libraries, Frameworks, etc. All from Newest questions tagged reactjs - Stack Overflow View React app build not applying some CSS declarations on stackoverflow.com

There is an issue with the CSS not being applied after the project is built. Locally the CSS displays correctly, using npm run start. Building and serving locally using npm run build and npm serve build or viewing on Netlify after deployment from Github displays the issues. Some CSS declarations are missing from matched elements, despite being present in the CSS class/ID rule, and present in the .css file itself.

I have checked in Firefox and Chrome. Both show the same issue. The CSS is on the server, is applying to most elements, and even the element where the issue is but one line here and there is just, not there.

This is from the App.css on the Github repo. Line 67 is not being applied, yet the surrounding block is applied, even the display: flex, line 66, is applied.

 .form-input-group {
        width: 100%;

.form-input-group-container { width: 100%;

&>div { 66 display: flex; 67 flex-direction: column;

width: auto; }

Here is a screenshot from the live server at Netlify on the "contact" page (no server side routing). enter image description here This App.css file is present on the Netlify server: enter image description here

Scroll to top