Lots of Groovers have iPhones. Our company Web site, however, looks pretty ... uh ... bad on an iPhone. So I thought I would take it upon myself to add some iPhone-specific CSS to our site and clean things up a bit.
The first thing I found in my efforts was this page about how to add CSS that will only be read by the iPhone browser. Very nice!
I did most of my initial debugging by letting my iPhone-only CSS format my local version of the Groove11.com site in Firefox. When I wanted to see the real deal, I simply refreshed my iPhone browser. The same site that gave me the code for adding iPhone-only CSS, however, also mentions an open source iPhone simulator called iPhoney. I didn't try it but it may be worthwhile for larger scale sites.
One problem I ran into with my iPhone CSS is that the Groove11.com site ended up looking very small, as if I had zoomed out of it on my phone. I tried changing the widths of the divs throughout the home page but nothing helped. After some googling, I found an article ("6 Tips to Optimize Your Website for iPhone") that pointed me to the "viewport" meta tag. Setting the "content" attribute to "width = device-width" will make a site's content, appropriately enough, fit the width of the device. The full tag is:
meta name="viewport" content="width = device-width">The site's looking pretty good on the iPhone, if I do say so myself.
Applied Mathmatics In Medicine http://www.spinstreetbikes.com/ambien.html - zolpidem price See the list of reputable online pharmacies selling Ambien (Zolpidem) at discounted price. http://www.spinstreetbikes.com/ambien.html - zolpidem without prescription
Posted by: Atonnamok | 10/23/2011 at 01:01 AM