The mobile version for my website is just a smaller version of the desktop one with larger fonts. I sized everything with the vw unit so that they can be responsive, but for some reason the published site is not aligning correctly for mobile despite it looking right in the designer. Please Help; I am on a tight deadline for the project too
So, I am constantly trying to debug it, but if anyone else is kind enough to provide a solution, instead of saying fix it yourself, I would really appreciate it. I thought that’s what the forum is for; let me know if i’m missing something. I’m fairly new here.
So far, it seems that the viewport unit (vw) is not matching between safari and chrome or something.
There is plenty of help provided in the forums, just can take a while to get help. I would recommend you add some screenshots to show the issues so people don’t have to guess what you are trying to fix. Beats text.
I’ve been able to fix much of misalignment since by making every section a 1 column grid (no idea why that worked) but now I can see that the bold fonts are not coming up the same for Chrome and for Safari, which is pretty much the only thing left not working.
The first picture is how it looks on Safari, the second, Chrome.
It’s misaligned in chrome on my PC as well, although not quite as badly as in the safari picture. I think it just has to do with the maths involved with VW and px. Your getting it exact on your screen but due to how it rounds up or down it’s gonna be off on other screen resolutions. Your best bet is to use SVGs instead of trying to align divs and letters.
