I have been working on this site for a few days now and am trying to get it to look great when the window/viewport is ANY size… Currently it looks pretty good on a widescreen or normal 1024 monitor for me… However I am having problems getting it dialed out for iPhone / iPad and smaller sizes…
I would like for everything to be responsive and fluid… Currently when viewed on an iPhone only the 1st block looks good… The other blocks have content that extends past the right side of the window so that the user has to scroll over with his/her finger to view the content.
I’ve played with the viewport (set min & max) and Iv’e now got a min-width of 980px on each of the blocks to make sure the background covers the screen… Not quite sure where I’m going wrong here…
Would appreciate some pointers or anything to make my site more responsive! Tips… WTFS… Etc 😉
Thanks again
(post these comments as an answer because it turned out to be the answer)
I’d suggest getting a hold of Zurb Foundation or Twitter Bootstrap (recommend Foundation) and using that as your base layout while you get more familiar with responsive design. Once you see how they’re put together you will be able to tackle your layout again.