making site display correctly on mobile devices (if possible)

[freaksaint]

hello everyone, i'm here to feed you a coding conundrum. i love my site (linked here) and the format dearly but hate that it displays so out of wack on mobile devices. if you look into the code you will see that i probably didn't go about the coding as cleanly as i could - the bulk of the coding was done over a year and a half ago and i'm fairly out of practice. i'm happy with the way my site looks on desktop for the most part but i would really like, at the very least, for the elements to not shift this way and that when the site is pulled up on a mobile device.

i will say i'm not necessarily looking to make my main site 'mobile responsive'. i realize that on a small screen someone might need to zoom in regardless - that's fine by me as long as everything stays in its place. i have some non-homepage pages that ARE mobile responsive since i worked on the coding later on. ALSO, when i refer to my site here i'm mostly referring to the home + links + about pages, which were all coded the same way.

i've heard something about code that lets you force a viewport on mobile devices - is that anything? or am i cursed to forever have shifted DIVs on mobile safari? let me know if you have any ideas! 

[Melooon]

heard something about code that lets you force a viewport on mobile devices

Yep, if you're not doing a responsive site and just want mobiles to be zoomed out you add this to your HTML head:

Code

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

You can play with that 0.5 number; lower numbers will be more zoomed out, and higher numbers will be more zoomed in; I find between 0.3 and 0.7 tends to be correct for my sites depending on their design.

It can also be handy to use a mobile emulator for testing sites on mobile, it lets you try design on a wide range of devices and see exactly how they will look (more accurately than just making your browser window smaller - the viewport trick won't display on a regular small browser window so you need to test it on a real mobile or emulated mobile)

[freaksaint]

You can play with that 0.5 number; lower numbers will be more zoomed out, and higher numbers will be more zoomed in; I find between 0.3 and 0.7 tends to be correct for my sites depending on their design.

omg, this was such a quick fix i feel so silly! thank you so much for imparting your knowledge :) i don't know if it's possible to make my site look perfect on EVERY device but this is a great start. at least now i know people can look up my site on their mobile device and get an idea of the desktop experience