Weird CSS behaviour in react production code

user_14206388 0
Viewed 64

I'm developing a personal website using react and I'm facing a very werid issue.

I've developed this website using create-react-app and tested it using the npm start command and made sure that everything in my website runs exactly as I would imagine it would. During testing the website looks totally fine.

I've now built my website using npm run build but I'm finding that some of the CSS works while some does not. This happens despite all of my CSS being in a single file.

I should not that I'm not getting any errors in the developer tools in chrome at all or anything of that sort.

Here is an example of what I mean. The image below is taken when the website is run through npm start

enter image description here

However, after building the website and opening the index.html file, the following screenshot is obtained

enter image description here

As you can see the styling for all of the other components is present except the styling the for Contact Us title at the beginning. Other titles on the page seem to be okay but this title does not seem to have the styling in place at all.

Additionally, there are other parts of the page where the styling if off too in the built version despite it being fine during testing.

My code is on https://github.com/Lm7m/Lm7m_website and I would appreciate any help I can get on this issue.

reactjs css dom html
1 Answers

apply like this in index.html create variable before return and then assign to tag

let colorstyle={
        color:black
    }

<h1 style={colorstyle}></h1>
user_150102250
Related