Project not loading on phone from mobile phone


I was trying to view my project on my phone to see how it would look. It does not display correctly for some reason on mobile but does on my laptop and within the chrome emulator. Any ideas? Seems weird?

Side note: I did try removing the background image feature because of its current size.


Try adding this in your codepen’s HTML settings in the “stuff for head” section:

<meta name="viewport" content="width=device-width, initial-scale=1">

you can also add that by clicking the “Insert the most common viewport meta tag” button directly below the “stuff for head” section

It still seems to not be loading on mobile, but loads everywhere else correctly. I’m not seeing errors that could be causing it either?

well, I hadn’t tried it on mobile, was just taking a guess based on what I saw in the codepen. but, I’m not seeing anything particularly wrong even on my mobile, altho the gray text is a bit difficult to read against that image.

what issues are you seeing?

On mobile, it’s only showing the two buttons and the h1. It’s almost like javascript is turned off, but its not.

I’m not getting the same on my mobile, it’s working fine in that regard. Using Chrome on an Android

Hmm, wonder if its an apple specific thing. I’m looking to adjust the readability of that text, figured it was gonna be hard to read. Thanks for testing and the help.