1

I built a website that works great on Firefox, IE, and Chrome. Client goes to a tradeshow and realizes the website menu went bonkers in their iPad.
broken menu http://www.glassdoctordenvermetro.com/wp-content/themes/GDDenverTheme/images/photo.JPG

I tried a website that lets you preview your design by simulating it in case you don't have an iPad (like me). But the problem is it looks fine: http://ipadpreview.com/previewer?url=http%3A%2F%2Fglassdoctordenvermetro.com%2F

What would suggest I do to figure this out? Is it a problem with the font being different on every browser perhaps? The width of the tab changes based on the menu font and wording but again, it looks fine on all other browsers I tested.

Thank you

4

1 に答える 1

3

iPad シミュレーターで開くと、フォントの幅がはるかに広く、文字間隔も広いことがわかります。font-familyiOS で使用できる別のより凝縮されたフォントを使用するには、タグでより多くのオプションを指定する必要があります。iOS でフォ​​ントサイズを小さくすることもできます。あなたが使用しているテスト サイトの大きな問題は、まだ HTML を出力していることです。そのような唯一の信頼できるサイトは、一貫性を確保するためにスクリーンショット イメージを生成する必要があります。

役立つフォントを次に示します: http://iosfonts.com/

そして11px、既存のフォントで動作します。

または、大文字の変換を削除すると、収まります。

于 2012-09-26T22:37:33.003 に答える