View Full Version : Safari Browser on iPad

09-12-2011, 08:01 AM
I am preparing a sample home page for a new site.

Using an iPad to preview the site, I noticed that the horizontal navigational links/menu appear 3 to 5 pixels lower than desired within the header section.

Using the Safari 5.1 browser on a Macbook pro, the position of the nav links appears to be correct. I intended to have the green-colored nav strip appear flush with the bottom of the image in the upper right corner.

What is causing the iPad Safari browser to lower some of the elements?

Also, I noticed a few other differences on the iPad:

The footer below the main content area appears to have a hairline border on the left, right and bottom sides.

The telephone and fax numbers are automatically being converted into blue, underlined links? Is there any simple what to not have telephone numbers become links on an iPad?

The sample page is located at:

09-12-2011, 08:19 AM
Doing some research on-line, I came across the following meta tag that appears to remove the automatic detection of phone numbers as links:

meta name="format-detection" content="telephone=no"

09-12-2011, 08:30 AM
The following meta tag disables zooming on the iPad, but at the same time, removes the unwanted hairline borders that were showing up around my footer section:

<meta name="viewport" content="initial-scale=1, maximum-scale=1">