The website is almost finished in terms of Three.JS and animations, but I am now trying to make it responsive, by changing the typography, for instance, but for some reason it doesn’t work, and it still seems to load old CSS? If you look at my file structure, I do not load another CSS file, all of the CSS code is within a style tag within the head tag and all of the HTML is within the body tag below the head tag.
As you can see in the screenshots, within my code, the font-size of the About Page (you can look at the screenshot or travel to it using the menu button on the top right) is 13px but for some reason, on the deployed website, it is still 17px. I attached a screenshot to show the difference between the two. You can use developer tools to find the text (which has a class of .aboutText), but a lot of the elements for the other pages are hidden, so you might struggle to find those DOM elements. They are in the ‘aboutPageContainer’ DOM element, if you’re looking for them.
Anyways, I’m not sure why the CSS does not update to the latest CSS. It doesn’t make a lot of sense, so I’d love to get some insight.
The Dev Tools showing that the font-size is 17px;
My code showing that it is set to 13px;
Screen Shot 2020-09-08 at 11.44.59 PM|690x405 !
Showing the DEV tools console to show that there are no errors
Screen Shot 2020-09-08 at 11.57.20 PM|690x381