色々と使い勝手良く作られているiPhone。
その便利機能のおかげでtableの一部のセルだけ文字が大きくなり、
!importantすら無視されてしまう問題に出会ったので修正方法をメモ。
html {
-webkit-text-size-adjust: 100%;
}結果から言うと、これで解決。
事件詳細
tableタグを使って、テーブル要素を作っていました。
tdの中身は font-size:12px !important;
にもかかわらず、勝手に大きくなる本町支店。アピールしなくていいのよ・・・
反映されているCSSはこんな感じ↓
なぜ勝手に・・・19pxお前どこから出てきた・・・
色々いじった結果、セルの幅が大きいと文字サイズも合わせて大きくしてくれるアリガターイ機能らしく、
こちらのCSSでさくっと修正できましたとさ。
html {
-webkit-text-size-adjust: 100%;
}ついでにタップで影が出るのも消しちゃいましょうね・・・
html {
-webkit-text-size-adjust: 100%;
-webkit-tap-highlight-color: rgba(0,0,0,0);
}おしまい！
