Width of web site: My Site Vs. Apple.com

Mobile
1

Hi,

I am redesigning a web site. I have been annoyed that the old web site has a horizontal navigation bar that fits in a horizontal line in a computer or mac browser. When I look at it on my iphone this horizontal navigation bar is spread over two lines.

I have looked at “http://www.apple.com” on my iphone and the horizontal navigation fits in one line and the apple.com web site is wider than mine (when viewed on a computer or mac).

The only thing I have noticed is when you arrive at my site using an iphone the text looks fairly large in the navigation bar. Whereas if I view apple.com on my iphone the text in the navigation bar is barley readable (it is tiny text). Obviously they expect the user to ‘zoom in’.

I would prefer mine to be barely readable like apple.com than to have it taking up two lines!!

Does anyone know the key to success???

Matt.

2

It probably has to do with you CSS and text size. use px size and not ems if you are using them. That might help

3

px means pixels but what is ems?

4

The current setting for text in the navigation bar is 13px. It looks fine on a computer/mac. What can I do for it to look good on iphone?