Ok I have a big problem that I don't know how to get around, I have never encountered this before - half my site won't display on mobile. It is cut in half. I have to present this site in a week and haven't tested on mobile until now - I do not know what to do. Here it is:
I have a full size image as that top image, and the text from that is extending over, however I don't know what the problem is. I use a few media selector sin my CSS, but only to change various small things.
I read up on setting
Ideally, you would have planned for mobile-friendliness. However, a very quick fix to get it not looking terrible is to replace:
<meta name="viewport" content="width=device-width, initial-scale=1">
in the HTML with:
<meta name="viewport" content="width=device-width, initial-scale=0.5">
This will set the screen width to the device width, but not scale the text fully to mobile-friendly sizes, meaning your font will be smaller than it should be, but it will fit. Here's a screenshot: