Sitemizde mobil Safari tutarsız yazı tipi boyutlarını söyle elimizden geldiğince ve bildiğim kadarıyla, sadece Mobil Safari ile işler. Bu bizi çok şaşkın.

Firebug ile site analiz ettik ve yanlış alanlara doğru stilleri devralmasını, henüz yazı hala yanlış boyutları ile işlenir.

1) http://www.panabee.com Ziyaret edin.

2) Bir etki alanı adı için bir arama Yapmak.

Sol tarafta kutular yanlış yazı tipi boyutlarını gösteriyor. Yazı tipi boyutunu sağ tarafta yazı tipi boyutu (başlık kutusu ve kutu kopya her ikisi de) aynı olmalıdır. Örneğin, bu başlıklar, "Varyasyon" ve "Twitter" Başlığı çok daha büyük, "Alternatif Sonlar."

Neden herhangi bir ipucu?

Mobil Safari (Chrome için Android, Cep Firefox ve IE Cep) artırır yazı tipi boyutu geniş blok (her zaman), böyle bir çift dokunun yakınlaştırmak o blok (uyuyor engellemek için ekran genişliği), metin okunaklı olacak. Eğer set -webkit-text-size-adjust: 100% (none) olmayacak mümkün bunu yapmak, ve ne zaman bir kullanıcı çift musluk yakınlaştırma geniş bloklar metin olacak illegibly küçük; kullanıcılara okuyabilir eğer onlar pinch-zoom, ama sonra metni olacak daha geniş ekranı ve sahip olacakları için pan yatay olarak okumak her satırının metin!

1. İdeal olacağını düzeltme aracı kullanarak Responsive Web Design teknikleri için tasarım uyum için mobil ekran boyutu (durumda ki artık herhangi bir çok geniş bloklar, mobil tarayıcılar ki artık ayarlayın yazı tipi boyutu).

2. Eğer böyle bir seçenek yok, sıkıştın hizmet veren bir masaüstü sitesine cep telefonu kullanıcıları, sonra bak bakalım tweak tasarım yani blok metin daha geniş daha mobil cihaz genişlik (ör: 320px için birçok portre telefonları) (kullanabilirsiniz cep-özel css önlemek etkileyen masaüstü tarayıcılar), Mobil Safari ihtiyacı olmayacak artırmak için herhangi bir yazı tipi boyutu (ve hangi tarayıcıları yeniden akış metin, gibi Android Tarayıcısı ve Opera Mobile, ayrıca düzeninizi değiştirin) ihtiyacınız olmayacak.

3. Nihayetgerçekten-webkit-text-size-adjust: 100%, ama bunu ayarlayabilirsiniz, yazı tipi boyutu ayarlama Mobil Safari önlemek gerekiyoryalnızca son çare olarakmobil kullanıcılar zorluk metin okuma için yol açma ihtimali olduğu için, ya çok küçük olacak ya da yanından her satırdan sonra yan pan gerekecek gibi okudular. none has nasty side-effects in desktop browsers 100% none kullanmanız gerektiğini unutmayın. Ayrıca -moz-text-size-adjust Mobil Firefox ve IE Mobile için -ms-text-size-adjust eşdeğer özellikleri vardır.

Edit: aşağıdaki CSS ekleyerek deneyebilirsin yani senin durumunda örneğin en basit muhtemelen 2. Alternatif:

/* Mobile browsers only */
@media only screen and (max-device-width: 480px) {
    table#all_results {
        width: auto;
    }
    td#main_box {
        width: 320px;
    }
    td#side_box {
        width: 320px;
    }
}

Bu gibi 320px koda için ideal olmasa da; CSS medya sorguları kullanarak çeşitli, ya da cihaz-genişliği JavaScript alarak bunu geliştirmek olabilir.