I finished my portfolio last night (https://codepen.io/crystallovesdc/full/ZrZprL) but it isn’t displaying properly outside the Chrome and Firefox desktop browsers. I am unable to understand what’s happened. I used CSS Grid to create the layout and visited their website to see if the code has browser compatibility issues. From what I’ve read, everything should be fine. Is there a kind and patient soul here who might be willing to look at my code and tell me what the issue is? Thanks in advance to all who respond with suggestions.
I just tried it on the latest version of Safari and it wasn’t any different from how it looks on Firefox. So either both are right or both are wrong. Could you post a screen shot of how it should look? You can drag and drop the image here on the forum to host it.
To ensure that your project is able to work in Codepen, you’ll have to make a few changes to your code. Codepen ignores the <head> tag and any external resources you load in there are not guaranteed to work. The platform expects you to load resources in their settings page.
You’ll also find it’s a lot easier to debug your code if you keep your JavaScript in the JS window and all of your style in your stylesheet. When you’re adding stuff like style="width:100%" style="height:100vh" to your HTML, you’re making it very difficult to keep track of where bugs could be. This won’t directly affect how your site renders, but if there’s an issue you might not see it.