trying my hand at thsi fluid grid layout thing and am having a few issues. part of the problem is i may just be trying to do too much, making an ecommerce site and the page has quite a few div's in it, a header, description, picture, cart, and price div per each item. the layout looks fine in the mobile view but i can't get the divs to match up in the tablet and desktop view.
i know there are other programs like bootstrap out there, but just not sure if they are going to run into the same issue. the simple fix would be just to create each of these items in photopshop and then each item would just be one div, instead of 5. but then the issue becomes i create the size of each item for the mobile view, but by the time it gets to the desktop view the quality of the image is going to be crummy.
the final option would be just to get another url and build that page for mobile, and have a link there on the page to view full site and just direct it to my url that has the desktop site up and running, and do vice versa on the desktop site.
HELLLLLPPPPPPPP! any advice or direction would be appreciated.
my url is http://www.coloredfortunecookies.com if you want to see my issues. you can play with the screen size in your browser and see all looks great in mobile view, but not the other.
I just think you're tying to put too much stuff into this. The best Responsive Web Designs are very clean and uncomplicated. See example below:
Basically no floats in mobile
2-floated columns in tablets
4-floated columns in desktops.
thanks nancy, makes sense.