2014年4月1日

iPadとPCのgoogle Chromeはスタイルが違う

 今やっているWebシステムのプロジェクトは、Google Chromeに統一して開発しているのです。
なのでブラウザが同じであればどんなプラットフォームでも同じデザインで見えると思っていたのが大間違いでした。

 iPadとPCではやはり見え方が違います。
プラットフォームごとのデフォルトのスタイルが違うんですよね。PCでは正しく見えていたのがiPadでは予想していないところで改行していたりとか…。

 これをある程度吸収するテクニックとして「スタイルシートのリセット」というのがあります。
ちょっと調べてでみました。

よく使われているCSS Resetスクリプトの一覧が載っています。
http://www.cssreset.com/

どれを使うと楽ちんに共通化できるかはこれから検証が必要なようです。

今作っている画面に適用して軽くチェックしてみたところ、「Yahoo! (YUI 3) Reset CSS」が一番しっくりしているようです。
 Tableのセル内にテキストボックスを配置しているケースで一番綺麗に収まっています。
他のリセットCSSだとセルからテキストボックスがはみ出してしまいます。


これを改造して使うことにしました。
http://yuilibrary.com/yui/docs/cssreset/


0 件のコメント:

コメントを投稿