I'm building a site and trying to stay as fluid as possible. I'm also trying to make the "desktop" view decent when loaded on mobile web browser (smartphone size). However... it seems that my text only wants to load in a column on the left side of the screen instead of stretching out across the entire screen and I can't figure out why. The containing divs are all set to 100% and on a desktop browser the text stretches as it should, even if I start changing the browser window size. It's as if the mobile browser is assuming that text (<p>) should only be 50% of the screen width on its own. Does anyone have any ideas on how to fix this?
I have a mobile friendly version of the same website but sometimes users want to see the desktop version instead of the mobile version while on mobile. I just don't want that particular experience to be awful.
Here is a screen cap of how it looks on a mobile browser: [
i.imgur.com ]
